/* Kamagra Center - base design from newdesigen/index.html */
:root{
      --blue:#004fc4;
      --blue-dark:#003b99;
      --blue-soft:#eaf4ff;
      --green:#20b455;
      --text:#12245a;
      --muted:#66708a;
      --border:#dbe6f3;
      --bg:#ffffff;
      --shadow:0 15px 35px rgba(0,54,135,.12);
      --radius:18px;
    }

    *{
      box-sizing:border-box;
      margin:0;
      padding:0;
    }

    body{
      font-family: "Heebo", Arial, sans-serif;
      background:#fff;
      color:var(--text);
      line-height:1.6;
    }

    button,
    input,
    select,
    textarea{
      font-family:inherit;
    }

    a{
      text-decoration:none;
      color:inherit;
    }

    .container{
      width:min(1180px, 92%);
      margin:auto;
    }

    /* Top bar */
    .top-bar{
      background:linear-gradient(90deg,#00358f,#0056d8);
      color:#fff;
      font-size:14px;
    }

    .top-inner{
      min-height:42px;
      display:grid;
      grid-template-columns:1fr 1fr 1fr;
      align-items:center;
      gap:20px;
      text-align:center;
      font-weight:700;
    }

    .top-item{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }

    .top-icon{
      width:18px;
      height:18px;
      flex-shrink:0;
    }

    /* Header */
    .header{
      background:#fff;
      border-bottom:1px solid #e6edf7;
      position:sticky;
      top:0;
      z-index:50;
      box-shadow:0 6px 18px rgba(0,0,0,.04);
    }

    .header-inner{
      height:83px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
    }

    .logo{
      display:flex;
      align-items:center;
      flex-shrink:0;
    }

    .logo img{
      height:54px;
      width:auto;
      display:block;
    }

    .header-nav-group{
      display:flex;
      align-items:center;
      flex:1;
      justify-content:center;
      min-width:0;
    }

    .header-tools{
      display:flex;
      align-items:center;
      gap:18px;
      flex-shrink:0;
    }

    .nav{
      display:flex;
      align-items:stretch;
      gap:26px;
      font-size:15px;
      color:#1a2f5c;
      font-weight:700;
      height:83px;
      width:100%;
    }

    .nav .header-auth{
      margin-inline-start:auto;
      align-self:center;
      height:auto;
    }

    .nav > a{
      display:inline-flex;
      align-items:center;
      border-bottom:3px solid transparent;
      white-space:nowrap;
    }

    .nav > a.active{
      color:var(--blue);
      border-bottom-color:var(--blue);
    }

    .whatsapp-btn{
      background:#25d366;
      color:#fff;
      padding:12px 24px;
      border-radius:10px;
      font-weight:800;
      font-size:15px;
      display:inline-flex;
      align-items:center;
      gap:10px;
      box-shadow:0 6px 16px rgba(37,211,102,.28);
      border:none;
      cursor:pointer;
      flex-shrink:0;
      white-space:nowrap;
    }

    .whatsapp-btn svg{
      width:22px;
      height:22px;
      flex-shrink:0;
    }

    .header-auth{
      display:flex;
      align-items:center;
      gap:10px;
      flex-shrink:0;
    }

    .btn-auth{
      padding:10px 20px;
      border-radius:10px;
      font-weight:800;
      font-size:15px;
      white-space:nowrap;
      display:inline-flex;
      align-items:center;
      transition:.2s ease;
    }

    .btn-login{
      background:#fff;
      color:var(--blue);
      border:2px solid var(--blue);
    }

    .btn-login:hover{
      background:var(--blue-soft);
    }

    .btn-register{
      background:var(--blue);
      color:#fff;
      border:2px solid var(--blue);
      box-shadow:0 6px 16px rgba(0,79,196,.2);
    }

    .btn-register:hover{
      transform:translateY(-2px);
    }

    .cart{
      position:relative;
      width:34px;
      height:34px;
      display:grid;
      place-items:center;
      flex-shrink:0;
      cursor:pointer;
      background:none;
      border:none;
      padding:0;
    }

    .cart img,
    .cart svg,
    .cart-icon{
      width:28px;
      height:28px;
      display:block;
      color:var(--blue);
    }

    .cart-badge{
      position:absolute;
      top:-6px;
      inset-inline-start:-6px;
      min-width:18px;
      height:18px;
      padding:0 4px;
      border-radius:999px;
      background:var(--blue);
      color:#fff;
      font-size:10px;
      font-weight:800;
      line-height:1;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      direction:ltr;
      unicode-bidi:isolate;
      text-align:center;
      box-sizing:border-box;
    }

    /* Hero */
    .hero{
      overflow:hidden;
      position:relative;
      display:flex;
      flex-direction:column;
      min-height:clamp(580px, 43vw, 660px);
      isolation:isolate;
    }

    .hero-media{
      position:absolute;
      inset:0;
      z-index:0;
      pointer-events:none;
      overflow:hidden;
      background-color:#eaf4fb;
      background-image:url('../images/b2c6811d-d84e-4359-a08b-5e530e6cdfab.png');
      background-repeat:no-repeat;
      background-position:center calc(50% + 55px);
      background-size:100% auto;
    }

    .hero-media img{
      display:none;
    }

    .hero-overlay{
      position:absolute;
      inset:0;
      z-index:1;
      pointer-events:none;
      background:linear-gradient(90deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.28) 38%,transparent 62%);
    }

    .hero-inner{
      flex:1;
      display:flex;
      align-items:center;
      justify-content:flex-end;
      position:relative;
      z-index:2;
      padding:50px 0 20px;
    }

    .hero-content{
      max-width:560px;
    }

    .hero-content h1{
      font-size:40px;
      line-height:1.35;
      color:#1e2a3a;
      margin-bottom:14px;
      font-weight:300;
    }

    .hero-content h1 strong{
      color:#0a3080;
      display:block;
      font-size:42px;
      font-weight:600;
      line-height:1.15;
      margin-top:6px;
    }

    .hero-desc{
      font-size:17px;
      color:#2e3a50;
      margin-bottom:10px;
      max-width:520px;
    }

    .hero-tags{
      font-size:15px;
      color:#4a5568;
      margin-bottom:26px;
      max-width:520px;
    }

    .hero-buttons{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:28px;
    }

    .btn{
      border:none;
      border-radius:10px;
      padding:14px 26px;
      font-weight:800;
      cursor:pointer;
      font-size:15px;
      display:inline-flex;
      align-items:center;
      gap:10px;
      transition:.2s ease;
      text-decoration:none;
    }

    .btn svg{
      width:20px;
      height:20px;
      flex-shrink:0;
    }

    .btn:hover{
      transform:translateY(-2px);
    }

    .btn-primary{
      background:var(--blue);
      color:#fff;
      box-shadow:0 8px 18px rgba(0,79,196,.22);
    }

    .btn-green{
      background:#25d366;
      color:#fff;
      box-shadow:0 8px 18px rgba(37,211,102,.25);
    }

    .btn.add-to-cart-btn,
    .add-to-cart-btn,
    .details-btn{
      font-family:inherit;
      font-size:15px;
      font-weight:700;
      line-height:1.2;
      letter-spacing:0;
    }

    .trust-row{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:12px;
      max-width:640px;
      margin-bottom:24px;
    }

    .trust-card{
      background:#fff;
      border:1px solid #e3ecf5;
      border-radius:12px;
      padding:8px 12px;
      display:flex;
      flex-direction:row;
      align-items:center;
      gap:8px;
      text-align:start;
      box-shadow:0 6px 18px rgba(0,52,130,.06);
      min-height:56px;
    }

    .trust-card .icon{
      width:28px;
      height:28px;
      display:grid;
      place-items:center;
      color:var(--blue);
      flex:0 0 auto;
    }

    .trust-card .icon svg{
      width:22px;
      height:22px;
    }

    .trust-card > div:last-child{
      line-height:1.2;
    }

    .trust-card b{
      font-size:11px;
      display:block;
      color:#142b6f;
      font-weight:800;
    }

    .trust-card span{
      font-size:10px;
      display:block;
      color:var(--muted);
    }

    .hero-disclaimer{
      display:flex;
      align-items:flex-start;
      gap:10px;
      width:100%;
      max-width:560px;
      margin-top:20px;
      color:var(--text);
      font-size:12px;
      font-weight:600;
      line-height:1.55;
      text-align:right;
    }

    .hero-disclaimer p{
      margin:0;
    }

    .age{
      display:inline-grid;
      place-items:center;
      width:30px;
      height:30px;
      border-radius:50%;
      border:2px solid var(--blue);
      color:var(--blue);
      font-weight:900;
      font-size:11px;
      flex-shrink:0;
    }

    /* Sections */
    section{
      padding:42px 0;
    }

    .section-title{
      text-align:center;
      color:var(--blue);
      font-size:30px;
      font-weight:900;
      margin-bottom:28px;
    }

    .cards{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:30px;
      align-items:stretch;
    }

    .cards .product-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:16px;
      padding:24px;
      box-shadow:0 12px 30px rgba(0,52,130,.08);
      display:grid;
      grid-template-columns:1fr 120px;
      grid-template-rows:1fr auto;
      gap:15px;
      align-items:stretch;
      height:100%;
      position:relative;
      transition:.2s ease;
    }

    .cards .product-card:hover{
      transform:translateY(-5px);
      box-shadow:var(--shadow);
    }

    .cards .product-card.featured{
      border:2px solid #7cb3ff;
      background:linear-gradient(180deg,#f6fbff,#fff);
    }

    .cards .tag{
      position:absolute;
      top:-13px;
      right:50%;
      transform:translateX(50%);
      background:var(--blue);
      color:#fff;
      padding:4px 18px;
      border-radius:999px;
      font-size:12px;
      font-weight:900;
    }

    .cards .product-info{
      grid-column:1;
      grid-row:1;
      align-self:stretch;
      min-width:0;
      display:flex;
      flex-direction:column;
      min-height:145px;
    }

    .cards .product-info h3{
      color:var(--blue);
      font-size:21px;
      margin-bottom:4px;
    }

    .cards .product-info small{
      color:#253151;
      font-weight:800;
    }

    .cards .product-info ul{
      list-style:none;
      margin:14px 0 0;
      color:#394662;
      font-size:14px;
      flex:1 1 auto;
    }

    .cards .product-info li{
      margin:6px 0;
    }

    .cards .product-info li::before{
      content:"✓";
      color:var(--green);
      font-weight:900;
      margin-left:8px;
    }

    .cards .price{
      color:var(--blue);
      font-size:27px;
      font-weight:900;
      line-height:1;
      margin-top:auto;
      padding-top:12px;
      flex-shrink:0;
    }

    .cards .price .card-price-current{
      color:inherit;
      font-size:inherit;
      font-weight:inherit;
      display:inline;
    }

    .price-old{
      font-size:18px;
      color:var(--muted);
      text-decoration:line-through;
      font-weight:600;
      margin-inline-start:6px;
    }

    .price > span:not(.price-old):not(.card-price-current){
      font-size:13px;
      color:var(--muted);
      display:block;
      margin-top:5px;
    }

    .cards .mini-pack{
      grid-column:2;
      grid-row:1;
      align-self:start;
      width:120px;
      height:145px;
      border-radius:10px;
      background:#fff;
      border:1px solid #d8e4f2;
      box-shadow:0 12px 18px rgba(0,55,135,.12);
      overflow:hidden;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .cards .mini-pack img{
      width:100%;
      height:100%;
      object-fit:contain;
      display:block;
    }

    .cards .full-width-btn{
      grid-column:1/-1;
      grid-row:2;
      align-self:end;
      width:100%;
      min-height:46px;
      height:46px;
      padding:0 13px;
      box-sizing:border-box;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:var(--blue);
      color:#fff;
      border:none;
      border-radius:11px;
      font-family:inherit;
      font-size:15px;
      font-weight:700;
      line-height:1.2;
      letter-spacing:0;
      cursor:pointer;
      flex-shrink:0;
    }

    /* Compact pack-size selector (homepage + shop cards) */
    .pack-size-card{
      margin:6px 0 0;
      flex:1 1 auto;
    }

    .pack-size-card .pack-size-options{
      display:flex;
      flex-direction:row;
      gap:4px;
    }

    .pack-size-card .pack-size-btn{
      flex:1;
      min-width:0;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:1px;
      padding:4px 2px;
      border:1px solid #d8e4f2;
      border-radius:8px;
      background:#fff;
      color:#102b70;
      font-family:inherit;
      font-size:11px;
      font-weight:800;
      line-height:1.2;
      cursor:pointer;
      transition:border-color .15s, background .15s;
    }

    .pack-size-card .pack-size-btn:hover{
      border-color:#7eb3f0;
      background:#f7fbff;
    }

    .pack-size-card .pack-size-btn.active{
      border-color:var(--blue);
      background:#eaf4ff;
      box-shadow:0 0 0 1px var(--blue);
    }

    .pack-size-card .pack-size-name{
      font-size:12px;
      font-weight:900;
    }

    .pack-size-card .pack-size-price{
      font-size:10px;
      color:var(--blue);
      font-weight:700;
    }

    .cards .pack-size-card{
      margin:8px 0 0;
      flex:1 1 auto;
    }

    .product-bottom .pack-size-card{
      margin-bottom:8px;
    }

    /* Why */
    .features{
      display:grid;
      grid-template-columns:repeat(5,1fr);
      gap:20px;
      text-align:center;
    }

    .feature{
      padding:10px 8px;
    }

    .feature-icon{
      width:56px;
      height:56px;
      margin:0 auto 14px;
      display:grid;
      place-items:center;
      color:var(--blue);
    }

    .feature-icon svg{
      width:48px;
      height:48px;
    }

    .feature h3{
      color:var(--blue);
      font-size:15px;
      font-weight:800;
      margin-bottom:6px;
      line-height:1.3;
    }

    .feature p{
      color:#3d5a8a;
      font-size:13px;
      line-height:1.4;
    }

    /* Steps */
    .steps{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:36px;
      position:relative;
    }

    .step{
      border:1px solid #e3ecf5;
      border-radius:14px;
      background:#fff;
      padding:28px 16px 22px;
      text-align:center;
      box-shadow:0 4px 14px rgba(0,52,130,.04);
      position:relative;
    }

    .step:not(:last-child)::after{
      content:"";
      position:absolute;
      left:-28px;
      top:50%;
      transform:translateY(-50%);
      width:0;
      height:0;
      border-top:8px solid transparent;
      border-bottom:8px solid transparent;
      border-right:12px solid var(--blue);
    }

    .step-icon{
      margin:0 auto 14px;
      width:48px;
      height:48px;
      display:grid;
      place-items:center;
      color:var(--blue);
    }

    .step-icon svg{
      width:42px;
      height:42px;
    }

    .step-icon.whatsapp{
      color:#25d366;
    }

    .step h3{
      color:var(--blue);
      font-size:15px;
      font-weight:800;
      margin-bottom:6px;
    }

    .step p{
      color:#3d5a8a;
      font-size:13px;
      line-height:1.4;
    }

    .steps-slider{
      position:relative;
    }

    /* Reviews */
    .reviews{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:28px;
    }

    .review{
      border:1px solid var(--border);
      background:#fff;
      border-radius:16px;
      padding:24px;
      box-shadow:0 12px 28px rgba(0,52,130,.06);
    }

    .stars{
      color:#ffc400;
      font-size:20px;
      margin-bottom:8px;
    }

    .review p{
      color:#34415f;
      font-size:15px;
      margin-bottom:14px;
    }

    .review b{
      color:var(--blue);
      font-size:14px;
      display:block;
    }

    .review small{
      display:block;
      color:var(--muted);
      font-size:12px;
      margin-top:4px;
    }

    .reviews-slider{
      position:relative;
    }

    .reviews-more{
      text-align:center;
      margin-top:32px;
    }

    .btn-outline{
      background:#fff;
      color:var(--blue);
      border:2px solid var(--blue);
      box-shadow:0 6px 16px rgba(0,79,196,.08);
    }

    .btn-outline:hover{
      background:var(--blue-soft);
    }

    /* FAQ */
    .faq-wrap{
      display:grid;
      grid-template-columns:260px 1fr;
      gap:28px;
      align-items:stretch;
    }

    .support-box{
      background:#f4f7fb;
      border:1px solid #e8eef5;
      border-radius:16px;
      padding:28px 22px;
      height:100%;
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:32px;
      box-shadow:0 6px 18px rgba(0,52,130,.04);
    }

    .support-row{
      display:flex;
      align-items:center;
      gap:14px;
      text-align:right;
    }

    .support-row-icon{
      width:52px;
      height:52px;
      flex-shrink:0;
      display:grid;
      place-items:center;
      color:var(--blue);
    }

    .support-row-icon svg{
      width:42px;
      height:42px;
    }

    .support-row-icon.whatsapp{
      color:#25d366;
    }

    .support-row-text b{
      display:block;
      color:var(--blue);
      font-size:16px;
      font-weight:800;
      line-height:1.35;
      margin-bottom:4px;
    }

    .support-row-text span{
      display:block;
      color:#5a6f8f;
      font-size:14px;
      line-height:1.4;
    }

    .faq-list{
      min-width:0;
    }

    .faq-list .faq-item{
      border:1px solid var(--border);
      border-radius:12px;
      margin-bottom:10px;
      overflow:hidden;
      background:#fff;
      transition:border-color .2s ease, box-shadow .2s ease;
    }

    .faq-list .faq-item.active{
      border-color:rgba(0,79,196,.35);
      box-shadow:0 8px 24px rgba(0,52,130,.08);
    }

    .faq-list .faq-question{
      width:100%;
      padding:17px 20px;
      background:#fff;
      border:none;
      text-align:right;
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:14px;
      cursor:pointer;
      color:var(--text);
      font-family:inherit;
      font-size:16px;
      font-weight:700;
      line-height:1.45;
      letter-spacing:0;
    }

    .faq-list .faq-question:hover{
      background:#f8fbff;
    }

    .faq-list .faq-answer{
      max-height:0;
      overflow:hidden;
      transition:max-height .3s ease, padding .3s ease, border-color .3s ease;
      color:var(--muted);
      padding:0 20px;
      font-size:14px;
      line-height:1.75;
      border-top:1px solid transparent;
    }

    .faq-list .faq-item.active .faq-answer{
      padding:14px 20px 18px;
      border-top-color:#eef3fa;
    }

    .faq-list .faq-item .plus{
      flex-shrink:0;
      width:32px;
      height:32px;
      border-radius:50%;
      background:var(--blue-soft);
      color:var(--blue);
      display:grid;
      place-items:center;
      transition:transform .25s ease, background .25s ease, color .25s ease;
    }

    .faq-list .faq-item .plus svg{
      width:16px;
      height:16px;
    }

    .faq-list .faq-item.active .plus{
      transform:rotate(45deg);
      background:var(--blue);
      color:#fff;
    }

    /* Portal FAQ accordion base */
    .accordion{
      display:flex;
      flex-direction:column;
      gap:0;
    }

    .accordion-item{
      overflow:hidden;
    }

    .accordion-header{
      width:100%;
      border:none;
      background:transparent;
      font-family:inherit;
      text-align:right;
      cursor:pointer;
    }

    .accordion-body{
      max-height:0;
      overflow:hidden;
      transition:max-height .3s ease;
    }

    .accordion-item.active .accordion-icon{
      transform:rotate(45deg);
    }

    /* CTA */
    .bottom-cta{
      margin:12px 0 0;
    }

    .cta-box{
      min-height:100px;
      background:url('../images/331ecc5f-c508-4801-af96-fb4016b8b906.png') center/cover no-repeat;
      color:#fff;
      border-radius:20px;
      display:grid;
      grid-template-columns:auto 1fr;
      align-items:center;
      gap:22px;
      padding:22px 34px;
      box-shadow:0 18px 35px rgba(0,76,190,.22);
      overflow:hidden;
    }

    .cta-box h2{
      font-size:27px;
    }

    .cta-box p{
      opacity:.9;
      font-size:15px;
    }

    /* Footer */
    .footer{
      background:linear-gradient(180deg,#0055cc,#003d9f);
      color:#fff;
      margin-top:35px;
    }

    .footer-inner{
      display:grid;
      grid-template-columns:1.1fr 1fr 1fr 1.2fr;
      gap:28px;
      padding:32px 0;
    }

    .footer h3{
      font-size:16px;
      margin-bottom:12px;
    }

    .footer p,
    .footer a{
      display:block;
      color:rgba(255,255,255,.84);
      font-size:13px;
      margin:6px 0;
    }

    .footer-logo img{
      height:80px;
      width:auto;
      display:block;
      margin-bottom:12px;
    }

    .copyright{
      border-top:1px solid rgba(255,255,255,.18);
      padding:10px 0 2px;
      text-align:center;
      font-size:12px;
      color:rgba(255,255,255,.8);
    }

    .footer-credit{
      text-align:center;
      padding:2px 0 6px;
      line-height:0;
    }

    .footer-credit a{
      display:inline-block;
      opacity:.85;
      transition:opacity .2s ease;
    }

    .footer-credit a:hover{
      opacity:1;
    }

    .footer-credit img{
      height:34px;
      width:auto;
      display:block;
    }

    .mobile-menu{
      display:none;
      background:var(--blue);
      color:#fff;
      border:none;
      border-radius:10px;
      padding:10px 13px;
      font-size:20px;
      line-height:1;
      cursor:pointer;
      position:relative;
      z-index:2;
    }

    .mobile-menu svg,
    .mobile-menu .menu-icon{
      width:22px;
      height:22px;
      display:block;
      color:#fff;
    }

    .nav-close svg,
    .nav-close-icon{
      width:20px;
      height:20px;
      display:block;
      color:var(--text);
    }

    .mobile-menu.is-open{
      background:#1a2f5c;
    }

    body.menu-open{
      overflow:hidden;
    }

    .nav-close{
      display:none;
    }

    /* Responsive */
    @media (max-width: 1000px){
      .top-inner{
        grid-template-columns:1fr;
        gap:5px;
        padding:9px 0;
      }

      body.menu-open .header{
        z-index:130;
      }

      .header-inner{
        height:auto;
        padding:12px 0;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        position:relative;
      }

      .header-nav-group{
        position:absolute;
        inset:0;
        width:0;
        height:0;
        overflow:visible;
        pointer-events:none;
      }

      .header-tools{
        gap:12px;
        flex-shrink:0;
      }

      .mobile-menu{
        display:block;
      }

      .nav{
        display:none;
        position:fixed;
        inset:0;
        z-index:120;
        width:100%;
        min-height:100dvh;
        background:#fff;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        padding:88px 24px 28px;
        overflow-y:auto;
        height:auto;
        pointer-events:auto;
      }

      .nav.open{
        display:flex;
      }

      .nav-close{
        display:grid;
        place-items:center;
        position:absolute;
        top:18px;
        inset-inline-end:24px;
        width:44px;
        height:44px;
        background:#1a2f5c;
        color:#fff;
        border:none;
        border-radius:10px;
        font-size:22px;
        line-height:1;
        cursor:pointer;
        z-index:1;
      }

      .nav-close svg,
      .nav-close .nav-close-icon{
        color:#fff;
      }

      .nav > a{
        width:100%;
        padding:18px 0;
        font-size:18px;
        border-bottom:1px solid var(--border);
      }

      .nav > a.active{
        color:var(--blue);
        padding-bottom:18px;
        border-bottom:1px solid var(--border);
      }

      .hero{
        min-height:auto;
      }

      .hero-media{
        background-image:url('../images/db7c3999-3adf-41ad-8749-b14430fc1555.png');
        background-size:cover;
        background-position:center 18%;
      }

      .hero-overlay{
        background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.65) 35%,rgba(255,255,255,.45) 60%,rgba(255,255,255,.15) 100%);
      }

      .hero-inner{
        justify-content:center;
        text-align:center;
        min-height:auto;
        padding:30px 16px;
        box-sizing:border-box;
      }

      .hero-content{
        max-width:100%;
      }

      .hero-content h1{
        font-size:28px;
        line-height:1.3;
        margin-bottom:10px;
      }

      .hero-content h1 strong{
        font-size:30px;
        line-height:1.2;
        margin-top:4px;
      }

      .hero-desc{
        font-size:15px;
        line-height:1.5;
        margin-bottom:8px;
      }

      .hero-tags{
        font-size:13px;
        line-height:1.45;
        margin-bottom:20px;
      }

      .hero-desc,
      .hero-tags{
        margin-inline:auto;
      }

      .hero-disclaimer{
        justify-content:flex-start;
        margin-inline:0;
        width:100%;
        max-width:100%;
        color:var(--text);
        background:rgba(255,255,255,.96);
        padding:12px 14px;
        border-radius:12px;
        border:1px solid rgba(0,79,196,.14);
        box-shadow:0 6px 20px rgba(0,52,130,.1);
        text-align:right;
      }

      .hero-buttons{
        justify-content:center;
        gap:8px;
        margin-bottom:22px;
      }

      .hero-buttons .btn{
        white-space:nowrap;
        font-size:12px;
        padding:12px 6px;
      }

      .trust-row{
        max-width:340px;
        margin-inline:auto;
        gap:10px;
      }

      .trust-card{
        flex-direction:row;
        align-items:center;
        justify-content:center;
        text-align:center;
        gap:6px;
        padding:8px 6px;
      }

      .trust-row,
      .cards,
      .features,
      .faq-wrap,
      .footer-inner{
        grid-template-columns:1fr 1fr;
      }

      .footer-inner{
        text-align:center;
      }

      .footer-logo img{
        margin-inline:auto;
      }

      .feature:last-child:nth-child(odd){
        grid-column:1 / -1;
        justify-self:center;
        width:calc(50% - 10px);
      }

      .reviews-slider{
        margin-inline:-16px;
        padding-inline:16px;
      }

      .reviews{
        display:flex;
        gap:14px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
        padding-bottom:6px;
      }

      .reviews::-webkit-scrollbar{
        display:none;
      }

      .review{
        flex:0 0 calc(100% - 32px);
        scroll-snap-align:start;
        min-width:0;
      }

      .steps-slider{
        margin-inline:-16px;
        padding-inline:16px;
      }

      .steps{
        display:flex;
        gap:14px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
        padding-bottom:6px;
      }

      .steps::-webkit-scrollbar{
        display:none;
      }

      .step{
        flex:0 0 calc(100% - 32px);
        scroll-snap-align:start;
        min-width:0;
      }

      .faq-wrap{
        align-items:stretch;
      }

      .step:not(:last-child)::after{
        display:none;
      }

      .cta-box{
        grid-template-columns:1fr;
        text-align:center;
        background-image:
          linear-gradient(135deg,rgba(0,85,204,.55),rgba(0,61,159,.68)),
          url('../images/331ecc5f-c508-4801-af96-fb4016b8b906 copy.png');
        background-size:cover;
        background-position:center;
        background-repeat:no-repeat;
      }

      .nav .header-auth{
        margin-top:0;
        margin-inline-start:0;
        width:100%;
        padding-top:16px;
        flex-direction:row;
        gap:12px;
        flex-shrink:0;
      }

      .nav .header-auth .btn-auth{
        flex:1;
        width:auto;
        min-width:0;
        justify-content:center;
        padding:14px 12px;
        border-bottom:none;
      }

      .nav .header-auth .btn-login{
        border:2px solid var(--blue);
      }

      .nav .header-auth .btn-register{
        border:2px solid var(--blue);
      }

      .cards .product-card{
        grid-template-columns:1fr;
        grid-template-rows:auto auto auto;
        text-align:center;
      }

      .cards .product-info{
        grid-column:1;
        grid-row:2;
        min-height:0;
        display:block;
      }

      .cards .product-info ul,
      .cards .pack-size-card{
        flex:none;
      }

      .cards .price{
        margin-top:10px;
        padding-top:0;
      }

      .cards .mini-pack{
        order:-1;
        grid-column:1;
        grid-row:1;
        width:140px;
        margin:0 auto 12px;
      }

      .cards .full-width-btn{
        grid-row:3;
      }

    }

    @media (max-width: 768px){
      .hero{
        min-height:auto;
      }

      .hero-overlay{
        background:linear-gradient(180deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.62) 100%);
      }
    }

    @media (max-width: 640px){
      html,
      body{
        overflow-x:hidden;
        max-width:100%;
      }

      .container{
        width:100%;
        max-width:100%;
        padding-inline:16px;
      }

      .whatsapp-btn{
        padding:10px 16px;
        font-size:13px;
      }

      .logo img{
        height:44px;
      }

      .hero-media{
        background-image:url('../images/db7c3999-3adf-41ad-8749-b14430fc1555.png');
        background-size:cover;
        background-position:center 15%;
      }

      .hero-overlay{
        background:linear-gradient(180deg,rgba(255,255,255,.85) 0%,rgba(255,255,255,.7) 32%,rgba(255,255,255,.5) 58%,rgba(255,255,255,.2) 100%);
      }

      .hero-inner{
        padding:24px 16px;
      }

      .hero-content h1{
        font-size:24px;
        line-height:1.3;
        margin-bottom:8px;
      }

      .hero-content h1 strong{
        font-size:26px;
        line-height:1.2;
        margin-top:4px;
      }

      .hero-desc{
        font-size:14px;
        line-height:1.55;
        margin-bottom:8px;
      }

      .hero-tags{
        font-size:12px;
        line-height:1.45;
        margin-bottom:18px;
      }

      .hero-disclaimer{
        font-size:12px;
        line-height:1.55;
        font-weight:600;
      }

      .trust-row{
        grid-template-columns:repeat(2,1fr);
        max-width:320px;
        gap:8px;
      }

      .trust-card{
        padding:8px 5px;
        min-height:50px;
      }

      .trust-card b{
        font-size:10px;
      }

      .trust-card span{
        font-size:10px;
      }

      .features{
        grid-template-columns:repeat(2,1fr);
        gap:14px;
      }

      .feature:last-child:nth-child(odd){
        width:calc(50% - 7px);
      }

      .feature-icon{
        width:48px;
        height:48px;
        margin-bottom:10px;
      }

      .feature-icon svg{
        width:40px;
        height:40px;
      }

      .feature h3{
        font-size:13px;
      }

      .feature p{
        font-size:11px;
      }

      .cards,
      .faq-wrap{
        grid-template-columns:1fr;
      }

      .footer-inner{
        grid-template-columns:1fr 1fr;
        gap:20px 16px;
        text-align:center;
      }

      .footer-inner > div:first-child,
      .footer-inner > div:last-child{
        grid-column:1 / -1;
      }

      .footer-logo img{
        margin-inline:auto;
      }

      .step,
      .review{
        flex:0 0 calc(100% - 24px);
      }

      .cards .product-card{
        grid-template-columns:1fr;
        grid-template-rows:auto auto auto;
        text-align:center;
      }

      .cards .product-info{
        grid-column:1;
        grid-row:2;
        min-height:0;
        display:block;
      }

      .cards .product-info ul,
      .cards .pack-size-card{
        flex:none;
      }

      .cards .price{
        margin-top:10px;
        padding-top:0;
      }

      .cards .mini-pack{
        order:-1;
        grid-column:1;
        grid-row:1;
        width:140px;
        margin:0 auto 12px;
      }

      .cards .full-width-btn{
        grid-row:3;
      }

      .section-title{
        font-size:25px;
      }

      .btn-auth{
        padding:8px 14px;
        font-size:13px;
      }

      .hero-buttons{
        flex-direction:row;
        align-items:stretch;
        gap:10px;
        margin-bottom:18px;
        max-width:100%;
      }

      .hero-buttons .btn{
        flex:1;
        width:auto;
        justify-content:center;
        padding:11px 4px;
        font-size:11px;
        gap:5px;
        white-space:nowrap;
      }

      .hero-buttons .btn-green{
        font-size:10px;
      }

      .hero-buttons .btn svg{
        width:18px;
        height:18px;
      }

      .hero-disclaimer{
        max-width:100%;
        padding-inline:4%;
      }

      .cta-box{
        padding:18px 20px;
        gap:16px;
      }

      .cta-box h2{
        font-size:22px;
      }

      .cta-box .whatsapp-btn{
        width:100%;
        justify-content:center;
      }

      section{
        padding:28px 0;
      }

      .faq-list .faq-question{
        font-size:15px;
        font-weight:700;
        line-height:1.45;
        padding:14px 16px;
      }

      .top-bar{
        display:none;
      }
    }

/* ===== PHP app components (cart, checkout, auth, etc.) ===== */
.page-hero{background:linear-gradient(135deg,var(--blue-dark,#003b99),var(--blue,#004fc4));color:#fff;padding:48px 0;text-align:center}
.page-hero-sm{padding:32px 0}
.page-hero h1{font-size:clamp(1.6rem,4vw,2.2rem);margin-bottom:8px;color:#fff}
.page-hero p{color:rgba(255,255,255,.85);max-width:640px;margin:0 auto}
.section{padding:48px 0}
.breadcrumb,.breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;margin-bottom:12px}
.breadcrumb-dark{color:var(--muted)}
.form-group{margin-bottom:16px}
.form-label{display:block;font-weight:700;margin-bottom:6px;font-size:14px;color:var(--text)}
.form-input,.form-select,.form-textarea{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;font-family:inherit;font-size:15px;background:#fff;color:var(--text)}
.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,79,196,.12)}
.alert{padding:14px 18px;border-radius:12px;margin-bottom:16px;font-size:14px}
.alert-success{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}
.alert-error{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.alert-info{background:var(--blue-soft);color:var(--blue-dark);border:1px solid var(--border)}
.auth-card{max-width:480px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}
.auth-card h2{text-align:center;margin-bottom:24px;color:var(--text)}
.auth-steps{display:flex;gap:8px;margin-bottom:24px;justify-content:center}
.auth-step{flex:1;text-align:center;padding:8px;border-radius:10px;font-size:13px;font-weight:700;background:#f1f5f9;color:var(--muted)}
.auth-step.active{background:var(--blue);color:#fff}
.cart-table{width:100%;border-collapse:collapse}
.cart-table th,.cart-table td{padding:14px;border-bottom:1px solid var(--border);text-align:right;vertical-align:middle}
.cart-layout{display:grid;grid-template-columns:1fr 380px;gap:32px;align-items:start}
.cart-summary{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.cart-summary-row{display:flex;justify-content:space-between;padding:8px 0;font-size:15px}
.cart-summary-total{display:flex;justify-content:space-between;padding:16px 0 0;margin-top:12px;border-top:2px solid var(--border);font-weight:800;font-size:18px}
.checkout-grid{display:grid;grid-template-columns:1fr 380px;gap:32px;align-items:start}
.checkout-summary-section{position:sticky;top:100px}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:stretch}
.home-blog-grid{margin-top:4px}
#articles{background:linear-gradient(180deg,#f8fbff 0%,#fff 100%)}
.blog-card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 12px 28px rgba(0,65,160,.07);display:flex;flex-direction:column;height:100%;transition:transform .2s,box-shadow .2s}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.blog-card-image{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,var(--blue-soft,#eaf4ff),#f5f9ff);flex-shrink:0;text-decoration:none}
.blog-card-image img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .35s ease}
.blog-card:hover .blog-card-image img{transform:scale(1.03)}
.blog-card-image-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.blog-card-category{position:absolute;top:12px;right:12px;background:var(--blue);color:#fff;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:700;z-index:2;line-height:1.3}
.blog-card-body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.blog-card-meta{font-size:13px;color:var(--muted);margin:0}
.blog-card-title{font-size:1.05rem;font-weight:800;line-height:1.4;margin:0}
.blog-card-title a{color:var(--text);text-decoration:none;transition:color .2s}
.blog-card-title a:hover{color:var(--blue)}
.blog-card-excerpt{font-size:14px;color:var(--muted);line-height:1.65;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-card .btn{align-self:flex-start;margin-top:4px}
.blog-card .btn-sm{padding:8px 16px;font-size:13px}
@media(max-width:1000px){.blog-grid{grid-template-columns:repeat(2,1fr);gap:20px}}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr;max-width:400px;margin-left:auto;margin-right:auto}}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.legal-content{max-width:800px;margin:0 auto;line-height:1.8}
.legal-content h2{margin:32px 0 12px;color:var(--text)}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.review-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.empty-state{text-align:center;padding:48px 20px;color:var(--muted)}
.empty-state h3{margin-bottom:8px;color:var(--text)}
.empty-state svg{margin-bottom:16px;color:var(--blue);opacity:.5}
.text-green{color:var(--green,#20b455);font-weight:700}
.auth-links{text-align:center;margin-top:20px;font-size:14px}
.auth-links a{color:var(--blue);font-weight:700}
.auth-benefits{margin-top:24px;padding-top:20px;border-top:1px solid var(--border)}
.auth-benefits h4{font-size:15px;margin-bottom:12px;color:var(--text)}
.auth-benefits ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--muted)}
.auth-benefits li{display:flex;align-items:flex-start;gap:8px}
.otp-info{background:var(--blue-soft);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:18px;text-align:center}
.otp-info strong{color:var(--blue-dark,var(--blue))}
.otp-info-success{background:#ecfdf5;border-color:#a7f3d0}
.btn-link{background:none;border:none;color:var(--blue);cursor:pointer;text-decoration:underline;font-size:14px;padding:0;font-family:inherit}
.btn-icon{background:none;border:0;cursor:pointer;padding:4px;color:var(--muted);display:inline-flex;align-items:center;justify-content:center}
.cart-items-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.cart-summary-section{position:sticky;top:100px}
.cart-item-product{display:flex;align-items:center;gap:14px}
.cart-item-image{width:70px;height:70px;background:#f8fafc;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;text-decoration:none}
.cart-item-image img{max-width:100%;max-height:100%;object-fit:contain}
.cart-item-name{font-weight:700;color:var(--text);text-decoration:none;display:block;margin-bottom:4px}
.cart-item-name:hover{color:var(--blue)}
.cart-item-variant{font-size:13px;color:var(--muted)}
.cart-item-price,.cart-item-total{font-weight:700;color:var(--text)}
.cart-item-total{color:var(--blue);font-weight:800}
.cart-qty-variant-locked{display:flex;flex-direction:column;align-items:center;gap:4px}
.cart-qty-locked-num{font-weight:700;border:1px solid var(--border);border-radius:8px;padding:4px 10px;background:#f8fafc}
.cart-change-pack{font-size:12px;color:var(--blue);text-decoration:underline;white-space:nowrap}
.cart-remove-btn:hover{color:#dc2626}
.checkout-grid .checkout-form-section,.checkout-grid .checkout-summary-section{min-width:0}
.checkout-form-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.checkout-section-title{font-size:1.1rem;font-weight:800;color:var(--text);margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--border)}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.shipping-methods,.payment-methods{display:flex;flex-direction:column;gap:12px}
.shipping-method,.payment-method{display:block;border:2px solid var(--border);border-radius:var(--radius);padding:14px;cursor:pointer;transition:.2s;position:relative}
.shipping-method.selected,.payment-method.selected{border-color:var(--blue);background:var(--blue-soft)}
.shipping-method input,.payment-method input{position:absolute;opacity:0;pointer-events:none}
.shipping-method-top{display:flex;align-items:center;gap:12px}
.shipping-method-info{flex:1}
.shipping-name,.payment-name{font-weight:700;display:block;color:var(--text)}
.shipping-desc{font-size:13px;color:var(--muted)}
.shipping-price{font-weight:800;color:var(--green)}
.shipping-price.discount{color:var(--blue)}
.shipping-icon,.payment-icon{display:flex;align-items:center;color:var(--blue)}
.checkout-items{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.checkout-item{display:flex;justify-content:space-between;gap:12px;padding:10px;background:#f8fafc;border-radius:10px}
.checkout-item-name{font-weight:700;font-size:14px}
.checkout-item-price{font-weight:800;color:var(--blue);white-space:nowrap}
.checkout-errors{background:#fef2f2;border:2px solid #fca5a5;border-radius:var(--radius);padding:16px;margin-bottom:24px}
.checkout-errors-header{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.checkout-errors-title{display:block;font-weight:800;color:#991b1b}
.checkout-errors-subtitle{font-size:14px;color:#b91c1c}
.checkout-errors-list{margin:0;padding:0 18px 0 0;color:#7f1d1d}
.checkout-trust{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.checkout-trust-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.checkout-mobile-bar{display:none;position:fixed;bottom:70px;right:0;left:0;background:#fff;border-top:1px solid var(--border);padding:12px 16px;z-index:75;box-shadow:0 -4px 20px rgba(0,0,0,.08)}
.checkout-mobile-bar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:600px;margin:0 auto}
.checkout-mobile-bar-price{font-size:20px;font-weight:800;color:var(--blue)}
.order-confirmation{max-width:800px;margin:0 auto}
.order-success-header{text-align:center;margin-bottom:32px;padding:24px 0}
.order-success-header .success-icon{width:80px;height:80px;margin:0 auto 16px;background:rgba(32,180,85,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--green)}
.order-success-header h1{font-size:1.75rem;margin-bottom:12px;color:var(--text)}
.order-details-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);margin-bottom:24px}
.order-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:16px 0}
.order-info-item .label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}
.order-info-item .value{font-weight:700;color:var(--text)}
.order-items-table{width:100%;border-collapse:collapse;margin:16px 0}
.order-items-table th,.order-items-table td{padding:12px;border-bottom:1px solid var(--border);text-align:right}
.order-items-table th{background:#f8fafc;font-size:13px;color:var(--muted)}
.order-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px}
.status-badge{display:inline-flex;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:700}
.status-pending,.status-new{background:#fef3c7;color:#92400e}
.status-confirmed{background:var(--blue-soft);color:var(--blue)}
.status-preparing{background:#dbeafe;color:#1e40af}
.status-shipped{background:rgba(32,180,85,.15);color:var(--green)}
.status-delivered,.status-completed{background:rgba(32,180,85,.25);color:#166534}
.status-cancelled{background:#fee2e2;color:#991b1b}
.highlight-box{background:var(--blue-soft);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}
.legal-content .highlight-box{margin:16px 0}
.contact-info-section,.contact-form-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.contact-method{display:flex;align-items:flex-start;gap:16px;padding:16px;border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px}
.contact-method-icon{width:48px;height:48px;border-radius:12px;background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mt-4{margin-top:24px}
@media(max-width:900px){.checkout-summary-section{position:static}.checkout-mobile-bar{display:block}.cart-summary-section{position:static}}
.pagination{display:flex;gap:8px;justify-content:center;margin-top:32px;flex-wrap:wrap}
.pagination a,.pagination span{padding:10px 16px;border:1px solid var(--border);border-radius:10px;font-weight:700;font-size:14px}
.pagination a:hover,.pagination .active{background:var(--blue);color:#fff;border-color:var(--blue)}
/* Mini cart */
.mini-cart-overlay,.mobile-menu-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:200;opacity:0;visibility:hidden;transition:.25s;pointer-events:none}
.mini-cart-overlay.active,.mobile-menu-overlay.active{opacity:1;visibility:visible;pointer-events:auto}
.mini-cart{position:fixed;top:0;left:0;width:min(400px,92vw);height:100%;background:#fff;z-index:201;transform:translateX(-100%);transition:.3s;display:flex;flex-direction:column;box-shadow:4px 0 24px rgba(0,0,0,.15)}
.mini-cart.active{transform:translateX(0)}
.mini-cart-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--border)}
.mini-cart-header h3{font-size:18px;margin:0}
.mini-cart-close{background:none;border:0;cursor:pointer;padding:8px;color:var(--muted)}
.mini-cart-items{flex:1;overflow-y:auto;padding:16px}
.mini-cart-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.mini-cart-item-img{width:60px;height:60px;object-fit:contain;border-radius:10px;background:#f8fafc}
.mini-cart-item-info{flex:1;min-width:0}
.mini-cart-item-name{font-weight:700;font-size:14px}
.mini-cart-item-price{font-weight:700;color:var(--blue);margin-top:4px}
.mini-cart-footer{padding:20px;border-top:1px solid var(--border)}
.mini-cart-total{display:flex;justify-content:space-between;font-weight:800;font-size:18px;margin-bottom:16px}
.qty-control{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:8px;padding:2px}
.qty-btn{background:none;border:0;width:28px;height:28px;cursor:pointer;font-size:16px;color:var(--blue)}
.qty-value{min-width:24px;text-align:center;font-weight:700}
.mini-cart-remove{background:none;border:0;cursor:pointer;color:#dc2626}
.btn-block{width:100%;display:block;text-align:center;margin-bottom:8px}
/* Toast */
.toast-container{position:fixed;top:100px;inset-inline-end:20px;z-index:9999;display:flex;flex-direction:column;gap:10px;align-items:flex-end;pointer-events:none;max-width:min(380px,calc(100vw - 40px))}
.toast-container .toast{pointer-events:auto;padding:14px 16px;border-radius:14px;color:#fff;font-weight:700;font-size:14px;box-shadow:0 12px 32px rgba(0,0,0,.18);opacity:0;transform:translateY(-12px);transition:opacity .3s,transform .3s;display:flex;align-items:center;gap:12px;width:100%;min-width:260px}
.toast-container .toast.show{opacity:1;transform:translateY(0)}
.toast-container .toast.hide{opacity:0;transform:translateY(-12px)}
.toast-container .toast-icon{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.22)}
.toast-container .toast-icon svg{display:block;stroke:#fff}
.toast-container .toast-message{flex:1;line-height:1.45;min-width:0}
.toast-container .toast-close{flex-shrink:0;background:none;border:none;color:#fff;font-size:20px;line-height:1;cursor:pointer;padding:0;margin:0;opacity:.8;border-radius:8px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;font-family:inherit}
.toast-container .toast-close:hover{opacity:1;background:rgba(255,255,255,.18)}
.toast-container .toast-success{background:var(--green,#20b455)}
.toast-container .toast-error{background:#dc2626}
.toast-container .toast-info{background:var(--blue)}
.toast-container .toast-warning{background:#d97706}
@media(max-width:640px){.toast-container{top:auto;bottom:90px;inset-inline-end:16px;inset-inline-start:16px;align-items:stretch;max-width:none}}
/* Popup, banners, a11y */
.popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9998;display:flex;align-items:center;justify-content:center;padding:20px}
.popup-box{background:#fff;border-radius:var(--radius);padding:32px;max-width:480px;width:100%;position:relative}
.popup-close{position:absolute;top:12px;left:16px;background:none;border:0;font-size:24px;cursor:pointer}
.top-banner{background:linear-gradient(90deg,#00358f,#0056d8);color:#fff;text-align:center;padding:10px 40px;font-size:14px;font-weight:700;position:relative}
.top-banner-close{position:absolute;left:12px;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:20px;cursor:pointer}
.whatsapp-float{position:fixed;bottom:90px;left:20px;width:56px;height:56px;background:#25d366;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 6px 20px rgba(37,211,102,.4);z-index:90}
.mobile-bottom-bar{display:none;position:fixed;bottom:0;right:0;left:0;background:#fff;border-top:1px solid var(--border);z-index:80;padding:8px 0}
.bottom-bar-items{display:flex;justify-content:space-around}
.bottom-bar-item{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--muted);padding:4px 12px;text-decoration:none}
.bottom-bar-item svg,.bottom-bar-icon{width:20px;height:20px;color:currentColor}
.bottom-bar-item.active svg{color:var(--blue)}
.bottom-bar-item.whatsapp-item{color:#25d366}
.accessibility-widget{position:fixed;top:50%;left:20px;transform:translateY(-50%);z-index:9000}
.accessibility-btn{width:52px;height:52px;border-radius:50%;background:var(--blue);color:#fff;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(0,79,196,.35);transition:.2s ease}
.accessibility-btn:hover,.accessibility-btn:focus{transform:scale(1.08);outline:3px solid var(--blue);outline-offset:3px}
.accessibility-btn[aria-expanded="true"]{background:var(--blue-dark)}
.accessibility-panel{position:fixed;left:20px;width:min(320px,calc(100vw - 40px));background:#fff;border-radius:var(--radius);box-shadow:0 20px 60px rgba(0,0,0,.18);border:1px solid var(--border);opacity:0;visibility:hidden;transform:scale(.97);transition:opacity .22s ease,transform .22s ease,visibility .22s;overflow:hidden;z-index:9001;display:flex;flex-direction:column;max-height:70vh}
.accessibility-panel.active{opacity:1;visibility:visible;transform:scale(1)}
.a11y-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--border);background:var(--blue-soft);color:var(--text)}
.a11y-header h4{margin:0;font-size:15px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--blue)}
.a11y-close{background:rgba(0,79,196,.1);border:0;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--blue);transition:.2s}
.a11y-close:hover,.a11y-close:focus{background:rgba(0,79,196,.18);outline:2px solid var(--blue);outline-offset:1px}
.a11y-body{overflow-y:auto;padding:12px;flex:1;overscroll-behavior:contain}
.a11y-section{margin-bottom:12px}
.a11y-section-title{font-weight:800;font-size:13px;margin-bottom:8px;color:var(--text)}
.a11y-font-controls{display:flex;align-items:center;gap:0;background:var(--blue-soft);border-radius:12px;overflow:hidden;border:1px solid var(--border)}
.a11y-font-btn{background:none;border:0;cursor:pointer;padding:10px 14px;font-weight:800;color:var(--text);transition:.15s}
.a11y-font-btn:hover,.a11y-font-btn:focus{background:var(--blue);color:#fff;outline:none}
.a11y-font-value{flex:1;text-align:center;font-size:14px;font-weight:800;color:var(--blue);border-inline:1px solid var(--border);padding:10px 0}
.a11y-option{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:10px;cursor:pointer;margin-bottom:4px;transition:.15s}
.a11y-option:hover,.a11y-option:focus{background:#f1f5f9;outline:none}
.a11y-option-label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--text);pointer-events:none}
.a11y-toggle{width:40px;height:22px;background:#cbd5e1;border-radius:11px;position:relative;transition:.2s;flex-shrink:0;pointer-events:none}
.a11y-toggle::after{content:'';position:absolute;top:2px;right:2px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s}
.a11y-option[aria-checked=true] .a11y-toggle,.a11y-toggle.active{background:var(--blue)}
.a11y-option[aria-checked=true] .a11y-toggle::after,.a11y-toggle.active::after{right:20px}
.a11y-panel-footer{padding:12px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:10px}
.a11y-reset-btn{background:none;border:1px solid var(--border);padding:8px 12px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:700;color:var(--text)}
.a11y-reset-btn:hover,.a11y-reset-btn:focus{background:var(--blue-soft);outline:2px solid var(--blue)}
.a11y-declaration-link{font-size:13px;font-weight:700;color:var(--blue);text-decoration:none}
.a11y-declaration-link:hover{text-decoration:underline}
.a11y-shortcut-hint{padding:8px 12px;font-size:11px;color:var(--muted);text-align:center;border-top:1px solid var(--border)}
.reading-guide{display:none;position:fixed;left:0;right:0;height:30px;background:rgba(255,235,59,.22);border-top:2px solid rgba(200,160,0,.5);border-bottom:2px solid rgba(200,160,0,.5);pointer-events:none;z-index:8990;top:0}
body.reading-guide-active .reading-guide{display:block}
body.high-contrast{filter:contrast(1.35)}
body.high-contrast a{color:#0000cc!important}
body.dark-mode{background:#0f172a;color:#e2e8f0}
body.dark-mode .header,body.dark-mode .footer,body.dark-mode .side-card,body.dark-mode .panel,body.dark-mode .product-card,body.dark-mode .popup-box{background:#1e293b;color:#e2e8f0}
body.dark-mode .nav{background:#1e293b}
body.monochrome{filter:grayscale(1)}
body.letter-spacing *{letter-spacing:.08em!important}
body.line-height-large *{line-height:1.8!important}
body.underline-links a{text-decoration:underline!important}
body.focus-highlight *:focus{outline:3px solid #f59e0b!important;outline-offset:2px!important}
body.pause-animations *,body.pause-animations *::before,body.pause-animations *::after{animation:none!important;transition:none!important}
body.large-cursor,body.large-cursor *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='16' cy='16' r='10' fill='black' stroke='white' stroke-width='2'/%3E%3C/svg%3E") 16 16,auto!important}
.header-account-wrap{display:flex;align-items:center;gap:8px}
.header-account-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;background:var(--blue-soft);color:var(--blue);font-weight:700;font-size:14px}
.header-points-badge{background:var(--green);color:#fff;padding:2px 8px;border-radius:20px;font-size:12px;font-weight:800}
.header-logout-btn{padding:8px;color:#dc2626;background:none;border:0;cursor:pointer;font-weight:700}
.medical-disclaimer{position:fixed;bottom:0;right:0;left:0;background:#fef3c7;border-top:2px solid #f59e0b;padding:12px 16px;z-index:9990;display:flex;gap:12px;align-items:center;transform:translateY(100%);transition:.35s}
.medical-disclaimer.visible{transform:translateY(0)}
.medical-disclaimer-close{background:var(--blue);color:#fff;border:0;padding:8px 16px;border-radius:8px;cursor:pointer;font-weight:700}
body.no-scroll{overflow:hidden;position:fixed;width:100%}
body.filter-open{overflow:hidden}
@media(max-width:900px){.checkout-grid,.cart-layout{grid-template-columns:1fr}.checkout-summary-section{position:static}}
@media(max-width:768px){.contact-grid{grid-template-columns:1fr}}
@media(max-width:640px){.mobile-bottom-bar{display:block}body{padding-bottom:70px}.whatsapp-float{bottom:80px;left:16px}.accessibility-widget{top:auto;bottom:148px;left:16px;transform:none}.accessibility-panel{left:16px;width:min(320px,calc(100vw - 32px))}}