/*
Theme Name: WINETOKEN
Theme URI: https://tokwine.com/
Author: WINETOKEN
Description: WINETOKEN — Wine Token.
Version: 1.1.1
Text Domain: winetoken
*/
:root{--green:#087a45;--green2:#0a9a59;--green-dark:#04512f;--orange:#f28a1a;--ink:#12241c;--muted:#63736b;--line:#dce9e1;--paper:#f6faf7;--white:#fff;--shell:1320px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.55}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.af-shell{width:min(calc(100% - 48px),var(--shell));margin:auto}.site-header{height:88px;display:flex;align-items:center;background:#fff;border-bottom:1px solid #edf3ef;position:relative;z-index:10}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:12px}
.brand img{width:250px;height:100px;object-fit:contain}.brand-copy strong{display:block;font-size:20px;letter-spacing:.05em;color:var(--green-dark)}.brand-copy span{display:block;font-size:11px;font-weight:800;letter-spacing:.13em;color:var(--orange)}.nav{display:flex;gap:30px;align-items:center;font-size:14px;font-weight:700;color:#405249}.nav a:hover{color:var(--green)}.hero{min-height:650px;position:relative;overflow:hidden;background:linear-gradient(100deg,#fff 0%,#fff 43%,#eef8f1 43%,#f5faf7 100%)}.hero-inner{min-height:650px;display:grid;grid-template-columns:46% 54%;align-items:center;position:relative}.hero-copy{padding:76px 54px 76px 0;position:relative;z-index:3}.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:900;letter-spacing:.16em;color:var(--green);text-transform:uppercase}.eyebrow:before{content:"";width:28px;height:3px;background:var(--orange);border-radius:4px}.hero h1{font-size:clamp(48px,5.2vw,78px);line-height:.98;letter-spacing:-.055em;margin:20px 0 24px;color:var(--green-dark);max-width:650px}.hero h1 em{font-style:normal;color:var(--orange)}.hero-lead{font-size:21px;max-width:590px;color:#53665c;margin:0 0 34px}.btn{display:inline-flex;align-items:center;gap:10px;background:var(--green);color:#fff;padding:15px 23px;border-radius:9px;font-weight:850;box-shadow:0 10px 30px rgba(8,122,69,.18)}.btn:hover{background:var(--green-dark)}
.hero-visual{height:100%;min-height:650px;position:relative;background:url('assets/images/hero-winetoken.avif') 30% center/cover no-repeat;isolation:isolate}.hero-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.72) 10%,rgba(255,255,255,.06) 42%,rgba(2,65,39,.12) 100%);z-index:1}.hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,80,45,.18));z-index:1}
.hero-logo-card{position:absolute;z-index:2;right:8%;top:20%;transform:translateY(-50%);width:min(330px,48%);background:#fff;border-radius:28px;padding:28px;box-shadow:0 24px 70px rgba(5,53,31,.22);border:1px solid rgba(255,255,255,.9)}.hero-logo-card img{width:100%;max-height:310px;object-fit:contain}.hero-stat{position:absolute;z-index:3;right:7%;bottom:7%;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);padding:13px 17px;border-radius:12px;font-size:12px;font-weight:850;color:var(--green-dark);box-shadow:0 10px 30px rgba(5,53,31,.12)}.intro{padding:78px 0 58px;text-align:center}.kicker{font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}.intro h2,.countries h2{font-size:clamp(34px,4vw,54px);line-height:1.05;margin:10px 0 16px;color:var(--green-dark);letter-spacing:-.035em}.intro p{max-width:760px;margin:auto;color:var(--muted);font-size:18px}.pillars{padding:0 0 84px}.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.pillar{padding:28px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 12px 35px rgba(16,73,45,.05)}.pillar b{display:block;color:var(--green-dark);font-size:18px;margin:10px 0 6px}.pillar span{color:var(--muted);font-size:14px}.pillar-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#edf8f1;color:var(--green);font-size:21px}.countries{background:var(--paper);padding:84px 0 96px;border-top:1px solid #edf3ef}.countries-head{text-align:center;margin-bottom:38px}.countries-head p{margin:0;color:var(--muted);font-size:16px}.country-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}.country{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 14px 12px;min-height:94px;display:flex;flex-direction:column;transition:.18s ease}.country:hover{transform:translateY(-2px);border-color:#a9d6bd;box-shadow:0 10px 24px rgba(5,81,47,.08)}.country-top{display:flex;align-items:center;gap:8px}.flag{font-size:23px;line-height:1}.code{font-size:11px;font-weight:900;letter-spacing:.1em;color:var(--green)}.country-name{font-weight:800;font-size:13px;line-height:1.18;margin-top:9px;flex:1}.tld{font-size:12px;font-weight:900;color:var(--orange);align-self:flex-end;margin-top:5px}.site-footer{background:#053c26;color:#d9e8df;padding:34px 0}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:13px}.footer-inner strong{color:#fff;letter-spacing:.08em}.footer-inner span{color:#9fc2ae}@media(max-width:1200px){.country-grid{grid-template-columns:repeat(5,1fr)}.nav{gap:18px}.hero-logo-card{right:5%}}@media(max-width:900px){.nav{display:none}.hero,.hero-inner{min-height:auto}.hero-inner{grid-template-columns:1fr}.hero-copy{padding:60px 0 44px}.hero-visual{min-height:480px;margin:0 -24px}.hero-visual:before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.1) 18%,rgba(2,65,39,.08) 100%)}.country-grid{grid-template-columns:repeat(3,1fr)}.pillar-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.af-shell{width:min(calc(100% - 28px),var(--shell))}.site-header{height:76px}.brand img{width:46px;height:46px}.brand-copy strong{font-size:17px}.brand-copy span{font-size:9px}.hero-copy{padding:46px 0 34px}.hero h1{font-size:48px}.hero-lead{font-size:17px}.hero-visual{min-height:400px;margin:0 -14px}.hero-logo-card{width:235px;right:7%;padding:19px;border-radius:20px}.hero-stat{right:6%;bottom:5%;font-size:10px}.intro{padding:60px 0 42px}.pillars{padding-bottom:62px}.pillar-grid{grid-template-columns:1fr 1fr;gap:10px}.pillar{padding:18px 14px}.pillar b{font-size:15px}.pillar span{font-size:12px}.countries{padding:62px 0 70px}.country-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.country{min-height:88px;padding:12px 11px}.country-name{font-size:12px}.footer-inner{display:block;text-align:center}.footer-inner span{display:block;margin-top:5px}}

/* =========================================================
   AFRTOK NETWORK
   ========================================================= */

.afrtok-network{
  padding:80px 24px;
  background:
    linear-gradient(
      135deg,
      #f7fbf8 0%,
      #ffffff 48%,
      #fff8ef 100%
    );
  border-top:1px solid #e5ece8;
  border-bottom:1px solid #e5ece8;
}

.afrtok-network-inner{
  width:min(1280px, 100%);
  margin:0 auto;
}


/* HEADER */

.afrtok-network-head{
  max-width:720px;
  margin:0 auto 42px;
  text-align:center;
}

.afrtok-network-head > span{
  display:inline-flex;
  align-items:center;
  gap:10px;

  margin-bottom:10px;

  font-size:12px;
  line-height:1;
  font-weight:800;
  letter-spacing:.16em;

  color:#ef8700;
}

.afrtok-network-head > span::before{
  content:"";
  width:28px;
  height:3px;
  border-radius:10px;
  background:#ef8700;
}

.afrtok-network-head h2{
  margin:0 0 12px;

  font-size:clamp(32px,4vw,50px);
  line-height:1.05;
  letter-spacing:-.04em;

  color:#006436;
}

.afrtok-network-head p{
  margin:0;

  font-size:17px;
  line-height:1.65;
  color:#53635b;
}


/* GRID */

.afrtok-network-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:20px;
}


/* CARD */

.afrtok-network-card{
  position:relative;

  display:flex;
  align-items:center;
  gap:22px;

  min-height:190px;
  padding:24px 54px 24px 24px;

  color:#17382a;
  text-decoration:none;

  background:#fff;

  border:1px solid #e1e9e4;
  border-radius:18px;

  box-shadow:
    0 8px 25px rgba(0,60,32,.05);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

.afrtok-network-card:hover{
  transform:translateY(-5px);

  border-color:rgba(0,100,54,.28);

  box-shadow:
    0 18px 42px rgba(0,60,32,.11);
}


/* LOGO */

.afrtok-network-logo{
  flex:0 0 125px;

  display:flex;
  align-items:center;
  justify-content:center;

  min-height:130px;

  padding:8px;

  background:#fff;
}

.afrtok-network-logo img{
  display:block;

  width:100%;
  max-width:125px;
  max-height:130px;

  object-fit:contain;
}


/* CONTENT */

.afrtok-network-content{
  min-width:0;
}

.afrtok-network-content h3{
  margin:0 0 8px;

  font-size:21px;
  line-height:1.1;
  font-weight:850;
  letter-spacing:.02em;

  color:#006436;
}

.afrtok-network-content p{
  margin:0 0 15px;

  font-size:14px;
  line-height:1.5;

  color:#64736c;
}

.afrtok-network-content strong{
  display:block;

  font-size:14px;
  font-weight:800;
  letter-spacing:.02em;

  color:#ef8700;
}


/* ARROW */

.afrtok-network-arrow{
  position:absolute;

  right:22px;
  top:50%;

  transform:translateY(-50%);

  font-size:25px;
  line-height:1;

  color:#ef8700;

  transition:transform .2s ease;
}

.afrtok-network-card:hover .afrtok-network-arrow{
  transform:translate(5px,-50%);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1050px){

  .afrtok-network-grid{
    grid-template-columns:1fr;
    max-width:760px;
    margin:0 auto;
  }

  .afrtok-network-card{
    min-height:170px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:600px){

  .afrtok-network{
    padding:55px 16px;
  }

  .afrtok-network-head{
    margin-bottom:28px;
  }

  .afrtok-network-head p{
    font-size:15px;
  }

  .afrtok-network-grid{
    gap:12px;
  }

  .afrtok-network-card{
    gap:15px;

    min-height:135px;

    padding:
      16px
      42px
      16px
      14px;

    border-radius:14px;
  }

  .afrtok-network-logo{
    flex-basis:88px;
    min-height:95px;
    padding:4px;
  }

  .afrtok-network-logo img{
    max-width:88px;
    max-height:95px;
  }

  .afrtok-network-content h3{
    font-size:18px;
  }

  .afrtok-network-content p{
    font-size:12.5px;
    line-height:1.4;
    margin-bottom:8px;
  }

  .afrtok-network-content strong{
    font-size:13px;
  }

  .afrtok-network-arrow{
    right:15px;
    font-size:21px;
  }

}
/* =========================================================
   MOBILE MENU BUTTON
   ========================================================= */

.menu-toggle {
    display: none;

    width: 44px;
    height: 44px;

    padding: 10px;

    border: 0;
    background: transparent;

    cursor: pointer;
}

.menu-toggle span {
    display: block;

    width: 24px;
    height: 2px;

    margin: 5px auto;

    background: #006436;
    border-radius: 10px;

    transition:
        transform 0.25s ease,
        opacity 0.25s ease;
}


/* Hamburger → X */

.menu-toggle.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.menu-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.menu-toggle.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .header-inner {
        position: relative;
    }


    /* Show hamburger */

    .menu-toggle {
        display: block;

        margin-left: auto;
        flex: 0 0 auto;
    }


    /* Hide navigation by default */

    .nav {
        display: none;

        position: absolute;
        z-index: 1000;

        top: 100%;
        left: 0;
        right: 0;

        padding: 10px 16px 18px;

        background: #ffffff;

        border-top: 1px solid #e5ece8;
        border-bottom: 1px solid #e5ece8;

        box-shadow:
            0 14px 30px rgba(0, 50, 28, 0.10);
    }


    /* Open navigation */

    .nav.nav-open {
        display: flex;

        flex-direction: column;
        align-items: stretch;

        gap: 0;
    }


    .nav a {
        display: block;

        padding: 13px 4px;

        color: #006436;
        font-size: 15px;
        font-weight: 700;

        text-decoration: none;

        border-bottom: 1px solid #edf2ef;
    }


    .nav a:last-child {
        border-bottom: 0;
    }

}
.sg-reveal-left,
.sg-reveal-right {
    opacity: 0;

    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}

.sg-reveal-left {
    transform: translateX(-45px);
}

.sg-reveal-right {
    transform: translateX(45px);
}

.sg-reveal-left.is-visible,
.sg-reveal-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* =========================================================
   TOKWINE — BLACK / GOLD / WHITE
   ========================================================= */

:root{
    --gold:#d9a441;
    --gold-light:#f3d17a;
    --gold-dark:#9b6819;

    --black:#050505;
    --black-soft:#0b0b0b;
    --black-card:#101010;

    --white:#ffffff;
    --muted:#b9b9b9;
    --line:rgba(217,164,65,.25);

    --shell:1320px;
}


/* =========================================================
   GLOBAL
   ========================================================= */

body{
    color:var(--white);
    background:var(--black);
}

a{
    color:inherit;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{
    background:#050505;
    border-bottom:1px solid rgba(217,164,65,.22);
}

.nav{
    color:#fff;
}

.nav a{
    color:#fff;
}

.nav a:hover{
    color:var(--gold);
}


/* =========================================================
   HERO
   ========================================================= */

.hero{
    background:#050505;
}

.hero-inner{
    background:#050505;
}

.hero-copy{
    background:#050505;
}


/* eyebrow */

.eyebrow{
    color:var(--gold);
}

.eyebrow:before{
    background:var(--gold);
}


/* H1 */

.hero h1{
    color:#fff;
}

.hero h1 em{
    color:var(--gold);
}


/* text */

.hero-lead{
    color:#d2d2d2;
}


/* button */

.btn{
    color:#050505;

    background:
        linear-gradient(
            135deg,
            #f5d982,
            #d7a43c
        );

    box-shadow:
        0 10px 30px rgba(217,164,65,.20);
}

.btn:hover{
    background:#f1cc69;
}


/* =========================================================
   HERO IMAGE
   ========================================================= */

.hero-visual:before{
    background:
        linear-gradient(
            90deg,
            #050505 0%,
            rgba(5,5,5,.82) 10%,
            rgba(5,5,5,.15) 38%,
            rgba(5,5,5,0) 60%
        );
}

.hero-visual:after{
    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.03),
            rgba(0,0,0,.20)
        );
}


/* LOGO CARD */

.hero-logo-card{
    background:#080808;

    border:1px solid rgba(217,164,65,.55);

    box-shadow:
        0 24px 70px rgba(0,0,0,.55);
}


/* HERO STAT */

.hero-stat{
    background:rgba(5,5,5,.90);

    color:var(--gold);

    border:1px solid rgba(217,164,65,.35);

    box-shadow:
        0 10px 30px rgba(0,0,0,.30);
}


/* =========================================================
   INTRO SECTIONS
   ========================================================= */

.intro{
    background:#050505;
}

.kicker{
    color:var(--gold);
}

.intro h2,
.countries h2{
    color:var(--gold);
}

.intro p{
    color:var(--muted);
}


/* =========================================================
   PILLARS
   ========================================================= */

.pillars{
    background:#050505;
}

.pillar{
    background:#0c0c0c;

    border:1px solid rgba(217,164,65,.22);

    box-shadow:
        0 12px 35px rgba(0,0,0,.25);
}

.pillar:hover{
    border-color:rgba(217,164,65,.55);
}

.pillar b{
    color:var(--gold);
}

.pillar span{
    color:#bcbcbc;
}

.pillar-icon{
    background:#17120a;
    color:var(--gold);

    border:1px solid rgba(217,164,65,.22);
}


/* =========================================================
   TOKWINE NETWORK
   ========================================================= */

.afrtok-network{
    background:#080808;

    border-top:1px solid rgba(217,164,65,.20);
    border-bottom:1px solid rgba(217,164,65,.20);
}


/* NETWORK HEADER */

.afrtok-network-head > span{
    color:var(--gold);
}

.afrtok-network-head > span::before{
    background:var(--gold);
}

.afrtok-network-head h2{
    color:var(--gold);
}

.afrtok-network-head p{
    color:#bdbdbd;
}


/* NETWORK CARDS */

.afrtok-network-card{
    color:#fff;

    background:#101010;

    border:1px solid rgba(217,164,65,.20);

    box-shadow:
        0 8px 25px rgba(0,0,0,.28);
}

.afrtok-network-card:hover{
    border-color:rgba(217,164,65,.65);

    box-shadow:
        0 18px 42px rgba(0,0,0,.45);
}


/* LOGO AREA */

.afrtok-network-logo{
    background:#080808;

    border:1px solid rgba(217,164,65,.15);

    border-radius:12px;
}


/* CARD TEXT */

.afrtok-network-content h3{
    color:var(--gold);
}

.afrtok-network-content p{
    color:#b9b9b9;
}

.afrtok-network-content strong{
    color:var(--gold);
}


/* ARROW */

.afrtok-network-arrow{
    color:var(--gold);
}


/* =========================================================
   FOOTER
   ========================================================= */

.site-footer{
    background:#020202;

    color:#c8c8c8;

    border-top:1px solid rgba(217,164,65,.22);
}

.footer-inner strong{
    color:var(--gold);
}

.footer-inner span{
    color:#999;
}


/* =========================================================
   HAMBURGER
   ========================================================= */

.menu-toggle span{
    background:var(--gold);
}


/* =========================================================
   MOBILE MENU
   ========================================================= */

@media (max-width:768px){

    .nav{
        background:#080808;

        border-top:1px solid rgba(217,164,65,.22);
        border-bottom:1px solid rgba(217,164,65,.22);

        box-shadow:
            0 14px 30px rgba(0,0,0,.45);
    }

    .nav a{
        color:#fff;

        border-bottom:
            1px solid rgba(217,164,65,.13);
    }

    .nav a:hover{
        color:var(--gold);
    }


    .hero-visual:before{
        background:
            linear-gradient(
                180deg,
                #050505 0%,
                rgba(5,5,5,.35) 15%,
                rgba(5,5,5,.02) 45%
            );
    }

}

/* =========================================================
   WINETOK FLYERS
   Desktop: 4
   Tablet:  2
   Mobile:  1
   ========================================================= */

.winetok-flyers{
    width:100%;
    padding:70px 24px;
}

.winetok-flyers-inner{
    width:100%;
    max-width:1400px;
    margin:0 auto;
}

.winetok-flyers-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:24px;
    align-items:start;
}

.winetok-flyer{
    display:block;
    width:100%;
    height:auto;
    border-radius:10px;

    box-shadow:
        0 14px 35px rgba(0,0,0,.14);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.winetok-flyer:hover{
    transform:translateY(-5px);

    box-shadow:
        0 20px 45px rgba(0,0,0,.20);
}


/* TABLET — 2 + 2 */

@media (max-width:1024px){

    .winetok-flyers{
        padding:55px 22px;
    }

    .winetok-flyers-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:24px;
    }

}


/* MOBILE — POD SEBOU */

@media (max-width:640px){

    .winetok-flyers{
        padding:40px 18px;
    }

    .winetok-flyers-grid{
        grid-template-columns:1fr;
        gap:28px;
    }

    .winetok-flyer{
        width:100%;
        max-width:520px;
        margin:0 auto;
    }

}