:root{
    --navy:#0b1c33;
    --navy-2:#0f2744;
    --blue:#1565d8;
    --blue-light:#3b9eff;
    --teal:#14c9a4;
    --ink:#0f172a;
    --gray-600:#5b6472;
    --gray-400:#8993a1;
    --bg-soft:#eef2f6;
    --bg-soft-2:#f5f7fa;
    --white:#ffffff;
    --radius:16px;
    --radius-sm:10px;
    --shadow:0 10px 30px rgba(15,28,51,0.08);
    --maxw:1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.5;
  }
  h1,h2,h3,h4{margin:0;line-height:1.15;font-weight:800;}
  p{margin:0;}
  a{text-decoration:none;color:inherit;}
  img{max-width:100%;display:block;}
  ul{margin:0;padding:0;list-style:none;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
  section{padding:88px 0;}
  section[id]{scroll-margin-top:76px;}
  .eyebrow{
    display:inline-block;
    font-size:13px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    padding:8px 18px;
    border-radius:999px;
  }
  .eyebrow-dark{background:rgba(255,255,255,0.12);color:#cfe3ff;}
  .eyebrow-light{background:#e7f0ff;color:var(--blue);}
  .eyebrow-green{color:#0d9c7d;letter-spacing:.1em;font-size:12.5px;font-weight:800;background:none;padding:0;}
  .section-head{text-align:center;max-width:720px;margin:0 auto 48px;}
  .section-head p.lead{color:var(--gray-600);font-size:17px;margin-top:16px;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    padding:15px 28px;border-radius:999px;font-weight:700;font-size:15.5px;
    border:2px solid transparent;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn-white{background:var(--white);color:var(--navy);}
  .btn-white:hover{box-shadow:0 8px 20px rgba(255,255,255,0.25);}
  .btn-outline{background:transparent;border-color:rgba(255,255,255,0.55);color:var(--white);}
  .btn-outline:hover{background:rgba(255,255,255,0.1);}
  .btn-gradient{background:linear-gradient(90deg,var(--blue) 0%,var(--teal) 100%);color:var(--white);border:none;}
  .btn-gradient:hover{box-shadow:0 10px 24px rgba(20,201,164,0.35);}
  .btn-dark{background:var(--navy);color:var(--white);}
  .btn-dark:hover{box-shadow:0 8px 20px rgba(11,28,51,0.35);}
  .btn-link{color:var(--blue);font-weight:700;display:inline-flex;align-items:center;gap:6px;}

  /* Header */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(255,255,255,0.98);
    border-bottom:1px solid #eef1f5;
    transition:box-shadow .25s ease;
  }
  header.scrolled{box-shadow:0 6px 20px rgba(15,28,51,0.08);}
  .nav{
    max-width:var(--maxw);margin:0 auto;padding:14px 24px;
    display:flex;align-items:center;justify-content:space-between;
  }
  .logo{display:flex;align-items:center;gap:10px;}
  .logo-mark{
    width:42px;height:42px;border-radius:10px;
    background:linear-gradient(135deg,var(--blue),var(--teal));
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-weight:800;font-size:18px;
  }
  .logo-mark-img{
    width:42px;height:42px;border-radius:10px;object-fit:contain;
    background:#fff;border:1px solid #e5e9ee;
  }
  .logo-text{line-height:1.1;}
  .logo-text .name{font-weight:800;font-size:18px;color:var(--navy);letter-spacing:.01em;}
  .logo-text .sub{font-size:10px;letter-spacing:.12em;color:var(--gray-400);font-weight:700;}
  nav.links{display:flex;gap:15px;align-items:center;}
  nav.links a{font-weight:600;font-size:13.5px;color:var(--ink);padding:6px 2px;border-bottom:2px solid transparent;white-space:nowrap;}
  nav.links a:hover{color:var(--blue);}
  .nav-cta{display:flex;align-items:center;gap:14px;flex-shrink:0;}
  .nav-cta .btn-gradient{padding:12px 18px;font-size:13.5px;white-space:nowrap;}
  .hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
  .hamburger span{display:block;width:24px;height:2.5px;background:var(--navy);margin:5px 0;border-radius:2px;}

  /* Mobile menu */
  .mobile-menu{
    display:block;position:fixed;inset:0;z-index:200;background:var(--white);
    padding:20px 24px;overflow-y:auto;
    opacity:0;visibility:hidden;transform:translateX(24px);pointer-events:none;
    transition:opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  }
  .mobile-menu.open{
    opacity:1;visibility:visible;transform:translateX(0);pointer-events:auto;
    transition:opacity .25s ease, transform .25s ease;
  }
  .mobile-menu-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
  .mobile-menu a.mlink{display:block;padding:16px;border-radius:12px;font-weight:700;font-size:17px;color:var(--ink);margin-bottom:6px;}
  .mobile-menu a.mlink.active{background:#e7f0ff;color:var(--blue);}
  .mobile-menu .btn-gradient{display:block;text-align:center;margin-top:16px;}

  /* Hero */
  .hero{
    background:radial-gradient(1200px 600px at 80% -10%, #1c73e5 0%, transparent 60%),
               linear-gradient(160deg, var(--navy) 0%, #0d3a75 45%, #1483d6 100%);
    color:#fff;position:relative;overflow:hidden;padding:110px 0 100px;
  }
  .hero::before{
    content:"";position:absolute;inset:0;opacity:.15;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cpath d='M42 0 L84 24 L84 72 L42 96 L0 72 L0 24 Z' fill='none' stroke='%23ffffff' stroke-width='1'/%3E%3C/svg%3E");
    background-size:84px 96px;
  }
  .hero .wrap{position:relative;max-width:720px;}
  .hero h1{font-size:56px;color:#fff;margin-top:20px;}
  .hero h1 .accent{color:#5fc3ff;display:block;}
  .hero p.lead{font-size:19px;color:#cfe0f5;margin-top:22px;max-width:600px;}
  .hero .actions{display:flex;gap:16px;margin-top:36px;flex-wrap:wrap;}

  /* Category strip */
  .categories{background:var(--bg-soft);padding:70px 0;}
  .cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  .cat-card{
    background:var(--white);border-radius:var(--radius);padding:28px 26px;
    box-shadow:var(--shadow);
  }
  .cat-icon{
    width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
    margin-bottom:18px;font-size:22px;
  }
  .cat-card h4{font-size:19px;margin-bottom:10px;}
  .cat-card p{color:var(--gray-600);font-size:14.5px;margin-bottom:16px;}

  /* Products */
  .products-toolbar{display:flex;flex-direction:column;gap:18px;margin-bottom:40px;}
  .search-input{
    width:100%;padding:15px 20px;border-radius:999px;border:1px solid #e1e6ec;
    background:var(--bg-soft-2);font-size:15px;
  }
  .filter-pills{display:flex;gap:10px;flex-wrap:wrap;}
  .pill{
    padding:11px 20px;border-radius:999px;font-weight:700;font-size:14.5px;
    background:var(--bg-soft-2);color:var(--ink);border:1px solid #e1e6ec;cursor:pointer;
  }
  .pill.active{background:var(--blue);color:#fff;border-color:var(--blue);}
  .product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .product-card{
    border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid #eef1f5;
    display:flex;flex-direction:column;
  }
  .product-media{
    height:210px;display:flex;align-items:center;justify-content:center;
    font-weight:800;font-size:15px;color:#94a3b8;text-align:center;padding:22px;
    background:#f0f7fc;
  }
  .product-media img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
  .product-body{padding:22px;flex:1;display:flex;flex-direction:column;}
  .product-tag{color:var(--blue);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px;}
  .product-body h4{font-size:20px;margin-bottom:6px;}
  .product-body p{color:var(--gray-600);font-size:14.5px;margin-bottom:16px;}
  .product-body .btn-link{margin-top:auto;}
  .product-card{cursor:pointer;transition:transform .15s ease, box-shadow .15s ease;}
  .product-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(15,28,51,0.12);}

  /* Product modal */
  .modal-overlay{
    display:flex;align-items:flex-start;justify-content:center;
    position:fixed;inset:0;z-index:400;background:rgba(11,20,38,0.6);
    padding:40px 20px;overflow-y:auto;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .2s ease, visibility 0s linear .2s;
  }
  .modal-overlay.open{
    opacity:1;visibility:visible;pointer-events:auto;
    transition:opacity .2s ease;
  }
  .modal-card{
    background:var(--white);border-radius:22px;max-width:640px;width:100%;
    margin:auto;position:relative;box-shadow:0 30px 70px rgba(0,0,0,0.35);
    transform:translateY(24px) scale(.97);transition:transform .25s ease;
  }
  .modal-overlay.open .modal-card{transform:translateY(0) scale(1);}
  .modal-close{
    position:absolute;top:24px;right:24px;width:34px;height:34px;border-radius:50%;
    background:var(--bg-soft);border:none;font-size:18px;color:var(--gray-600);cursor:pointer;
    display:flex;align-items:center;justify-content:center;
  }
  .modal-close:hover{background:#e1e6ec;}
  .modal-head{display:flex;gap:20px;align-items:flex-start;padding:32px 70px 24px 32px;border-bottom:1px solid #eef1f5;}
  .modal-thumb{
    width:80px;height:80px;min-width:80px;border-radius:14px;background:#f0f7fc;
    display:flex;align-items:center;justify-content:center;padding:8px;
  }
  .modal-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
  .modal-tag{color:var(--blue);font-weight:700;font-size:14.5px;margin-bottom:4px;}
  .modal-head h2{font-size:26px;margin-bottom:4px;}
  .modal-head .sub{color:var(--gray-600);font-size:15px;}
  .modal-body{padding:28px 32px 36px;}
  .modal-body h4{font-size:19px;margin-bottom:16px;}
  .modal-body .desc{color:var(--gray-600);font-size:15px;margin-bottom:26px;}
  .modal-functions{margin-bottom:26px;}
  .modal-functions li{position:relative;padding-left:20px;margin-bottom:12px;color:var(--gray-600);font-size:15px;}
  .modal-functions li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--blue);}
  .modal-box{background:var(--bg-soft);border-radius:14px;padding:20px 22px;margin-bottom:18px;}
  .modal-box .lbl{font-weight:800;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);margin-bottom:8px;}
  .modal-box p{color:var(--gray-600);font-size:14.5px;}
  .modal-box.pack{background:#f5f9ff;border:1px solid #dbe8fb;}
  .modal-box.pack .pack-row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;}
  .modal-box.pack .lbl{color:var(--gray-600);text-transform:none;font-weight:600;font-size:13.5px;margin-bottom:6px;}
  .modal-box.pack p{color:var(--ink);font-weight:700;font-size:14.5px;}
  .modal-box.pack .sku{color:var(--gray-400);font-size:13.5px;white-space:nowrap;}

  /* Solutions */
  .solutions{background:linear-gradient(160deg, var(--navy) 0%, #0d3a75 45%, #1483d6 100%);color:#fff;}
  .solutions .section-head p.lead{color:#d5e4f7;}
  .solutions-layout{display:grid;grid-template-columns:320px 1fr;gap:32px;align-items:start;}
  .challenge-list{display:flex;flex-direction:column;gap:10px;}
  .challenge-btn{
    display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;
    background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.08);
    color:#fff;font-weight:700;font-size:15.5px;cursor:pointer;text-align:left;width:100%;
  }
  .challenge-btn .ic{font-size:18px;}
  .challenge-btn.active{background:#1565d8;border-color:#1565d8;}
  .challenge-panel{background:var(--bg-soft);border-radius:var(--radius);padding:36px;color:var(--ink);}
  .challenge-panel-head{display:flex;gap:18px;align-items:flex-start;margin-bottom:26px;}
  .challenge-panel-icon{
    width:64px;height:64px;min-width:64px;border-radius:16px;background:#f59e0b;
    display:flex;align-items:center;justify-content:center;color:#fff;font-size:26px;
  }
  .challenge-panel h3{font-size:28px;margin-bottom:8px;}
  .challenge-panel p.desc{color:var(--gray-600);font-size:15.5px;}
  .two-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:26px;}
  .list-block h5{font-size:16px;margin-bottom:14px;}
  .list-block ul li{position:relative;padding-left:20px;margin-bottom:10px;color:var(--gray-600);font-size:15px;}
  .list-block.symptoms ul li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:#f59e0b;}
  .list-block.benefits ul li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:#0d9c7d;}
  .sci-box{background:#fff;border-radius:14px;padding:24px;margin-bottom:26px;}
  .sci-box h5{font-size:16px;margin-bottom:10px;}
  .sci-box p{color:var(--gray-600);font-size:15px;}
  .rec-products{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px;}
  .rec-pill{
    background:linear-gradient(90deg,var(--blue),var(--teal));color:#fff;font-weight:700;
    padding:12px 20px;border-radius:999px;font-size:14.5px;display:inline-flex;align-items:center;gap:8px;
  }

  /* About */
  .about-head{max-width:640px;}
  .about-head h2{font-size:38px;margin-top:16px;}
  .about-intro{color:var(--gray-600);font-size:16.5px;margin-top:20px;max-width:720px;}
  .about-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:44px;max-width:820px;}
  .about-cols h5{font-size:18px;margin-bottom:10px;}
  .about-cols p{color:var(--gray-600);font-size:15.5px;}

  /* Partners */
  .partner-list{display:flex;flex-direction:column;gap:24px;}
  .partner-card{
    background:var(--bg-soft);border-radius:var(--radius);padding:44px;
    display:flex;flex-direction:column;gap:18px;
  }
  .partner-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px;}
  .partner-badge{background:#d9f5ec;color:#0d9c7d;font-weight:800;font-size:13px;padding:8px 16px;border-radius:999px;}
  .partner-flag{font-size:30px;}
  .partner-card h3{font-size:30px;margin:6px 0 2px;}
  .partner-sub{color:var(--blue);font-weight:700;font-size:15px;}
  .partner-card p{color:var(--gray-600);font-size:15.5px;}

  /* Presence */
  .presence-stat-badge{display:inline-flex;align-items:center;gap:10px;background:var(--white);border:1px solid #e1e6ec;box-shadow:var(--shadow);border-radius:999px;padding:14px 30px;margin:28px 0 40px;}
  .presence-stat-badge .num{font-size:28px;font-weight:800;color:var(--blue);}
  .presence-stat-badge .lbl{color:var(--gray-600);font-size:14.5px;font-weight:700;}
  .city-pill-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:920px;margin:0 auto;}
  .city-pill{
    display:inline-flex;align-items:center;gap:8px;background:var(--white);border:1px solid #e1e6ec;
    border-radius:999px;padding:10px 20px;font-weight:700;font-size:14.5px;color:var(--ink);
    box-shadow:0 2px 8px rgba(15,28,51,0.04);transition:border-color .15s ease, box-shadow .15s ease;
  }
  .city-pill:hover{border-color:var(--blue);box-shadow:var(--shadow);}
  .city-pill .pin{color:var(--blue);font-size:12px;}
  .presence-cta{text-align:center;margin-top:36px;}

  /* Why Inno-Vet */
  .why{background:linear-gradient(160deg, var(--navy) 0%, #0d3a75 45%, #1483d6 100%);color:#fff;}
  .why .section-head p.lead{color:#d5e4f7;}
  .why-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
  .why-card{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius);padding:30px;}
  .why-icon{width:56px;height:56px;border-radius:14px;background:rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:18px;color:#7fc4ff;}
  .why-card h4{font-size:18.5px;color:#fff;margin-bottom:10px;}
  .why-card p{color:#c3d3e8;font-size:14.5px;}

  /* Contact */
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;}
  .contact-card{background:var(--bg-soft);border-radius:var(--radius);padding:28px;}
  .contact-card h4{font-size:20px;margin-bottom:14px;display:flex;align-items:center;gap:10px;}
  .contact-card p{color:var(--gray-600);font-size:15.5px;}
  .contact-row{display:flex;gap:12px;align-items:flex-start;margin-top:18px;}
  .contact-row .ic{color:var(--blue);font-size:18px;margin-top:2px;}
  .map-wrap{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative;min-height:340px;}
  .map-wrap iframe{width:100%;height:100%;min-height:340px;border:0;display:block;}
  .map-open{
    position:absolute;top:14px;left:14px;background:#fff;padding:10px 16px;border-radius:10px;
    font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:6px;box-shadow:var(--shadow);
  }

  /* Footer */
  footer{background:var(--navy);color:#c9d4e2;padding:70px 0 0;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,0.08);}
  .footer-brand .logo-mark{margin-bottom:16px;}
  .footer-brand p{font-size:14.5px;color:#a9b6c8;margin:16px 0 20px;}
  .social-row{display:flex;gap:10px;}
  .social-ic{
    width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,0.08);
    display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;
  }
  .footer-col h5{color:#8ea0b8;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px;}
  .footer-col ul li{margin-bottom:12px;font-size:14.5px;}
  .footer-col ul li a:hover{color:#fff;}
  .footer-contact li{display:flex;gap:10px;font-size:14.5px;margin-bottom:14px;align-items:flex-start;}
  .footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;flex-wrap:wrap;gap:10px;font-size:13.5px;color:#8291a4;}

  /* Notice banner (build note) */
  .build-note{background:#fff7e6;border-bottom:1px solid #f2d98a;color:#7a5b00;font-size:13.5px;padding:10px 24px;text-align:center;}
  .build-note strong{font-weight:800;}

  /* Animations & interactions */
  @keyframes heroFadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
  .hero .eyebrow{animation:heroFadeUp .7s ease both;}
  .hero h1{animation:heroFadeUp .7s ease .1s both;}
  .hero p.lead{animation:heroFadeUp .7s ease .2s both;}
  .hero .actions{animation:heroFadeUp .7s ease .3s both;}
  @keyframes floatSlow{0%,100%{transform:translate(0,0);}50%{transform:translate(-10px,-14px);}}
  .hero::before{animation:floatSlow 12s ease-in-out infinite;will-change:transform;}

  nav.links a{position:relative;}
  nav.links a::after{
    content:"";position:absolute;left:2px;right:2px;bottom:-2px;height:2px;
    background:linear-gradient(90deg,var(--blue),var(--teal));
    transform:scaleX(0);transform-origin:left;transition:transform .25s ease;
  }
  nav.links a:hover::after,nav.links a.active::after{transform:scaleX(1);}
  nav.links a.active{color:var(--blue);}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease, transform .6s ease;transition-delay:var(--d,0s);}
  .reveal.in{opacity:1;transform:translateY(0);}

  .cat-card{transition:transform .2s ease, box-shadow .2s ease;}
  .cat-card:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(15,28,51,0.12);}
  .cat-icon{transition:transform .3s ease;}
  .cat-card:hover .cat-icon{transform:scale(1.12) rotate(-6deg);}

  .product-media img{transition:transform .35s ease;}
  .product-card:hover .product-media img{transform:scale(1.06);}

  .why-card{transition:transform .25s ease, border-color .25s ease;}
  .why-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,0.3);}
  .why-icon{transition:transform .3s ease;}
  .why-card:hover .why-icon{transform:scale(1.12) rotate(6deg);}

  .partner-flag{display:inline-block;transition:transform .3s ease;}
  .partner-card:hover .partner-flag{transform:rotate(-10deg) scale(1.12);}

  .city-pill{transition:transform .2s ease, border-color .15s ease, box-shadow .15s ease;}
  .city-pill:hover{transform:translateY(-3px) scale(1.05);}

  .pill{transition:transform .12s ease, background .2s ease, color .2s ease, border-color .2s ease;}
  .pill:active{transform:scale(.94);}

  .btn-link{transition:gap .2s ease;}
  .btn-link:hover{gap:10px;}

  .challenge-btn{transition:transform .2s ease, background .2s ease, border-color .2s ease;}
  .challenge-btn:hover{transform:translateX(4px);}

  .social-ic{transition:transform .2s ease, background .2s ease;}
  .social-ic:hover{transform:translateY(-3px);background:var(--blue);}

  .presence-stat-badge{transition:transform .3s ease;}
  .presence-stat-badge:hover{transform:scale(1.04);}

  .logo-mark-img,.logo-mark{transition:transform .3s ease;}
  .logo:hover .logo-mark-img,.logo:hover .logo-mark{transform:rotate(-8deg) scale(1.06);}

  @media (prefers-reduced-motion:reduce){
    .hero .eyebrow,.hero h1,.hero p.lead,.hero .actions,.hero::before{animation:none;}
    .reveal{opacity:1;transform:none;transition:none;}
    *{scroll-behavior:auto !important;}
  }

  @media (max-width:980px){
    .cat-grid{grid-template-columns:repeat(2,1fr);}
    .product-grid{grid-template-columns:repeat(2,1fr);}
    .solutions-layout{grid-template-columns:1fr;}
    .about-cols{grid-template-columns:1fr;}
    .why-grid{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    nav.links{display:none;}
    .hamburger{display:block;}
    .nav-cta .btn-gradient{display:none;}
  }
  @media (max-width:600px){
    .hero h1{font-size:38px;}
    .cat-grid,.product-grid,.footer-grid,.two-col{grid-template-columns:1fr;}
    section{padding:64px 0;}
    .about-head h2{font-size:30px;}
  }

/* ---------- Inner page banner (shared by every page except Home) ---------- */
.page-hero{
  background:radial-gradient(1000px 500px at 85% -20%, #1c73e5 0%, transparent 60%),
             linear-gradient(160deg, var(--navy) 0%, #0d3a75 55%, #1483d6 100%);
  color:#fff;position:relative;overflow:hidden;padding:72px 0 64px;
}
.page-hero::before{
  content:"";position:absolute;inset:0;opacity:.12;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cpath d='M42 0 L84 24 L84 72 L42 96 L0 72 L0 24 Z' fill='none' stroke='%23ffffff' stroke-width='1'/%3E%3C/svg%3E");
  background-size:84px 96px;animation:floatSlow 12s ease-in-out infinite;will-change:transform;
}
.page-hero .wrap{position:relative;}
.page-hero .crumbs{font-size:13.5px;color:#9fc0e6;font-weight:600;margin-bottom:18px;animation:heroFadeUp .6s ease both;}
.page-hero .crumbs a{color:#cfe3ff;}
.page-hero .crumbs a:hover{color:#fff;}
.page-hero .crumbs span{margin:0 8px;opacity:.6;}
.page-hero .eyebrow{animation:heroFadeUp .6s ease .05s both;}
.page-hero h1{font-size:46px;color:#fff;margin-top:16px;max-width:780px;animation:heroFadeUp .6s ease .1s both;}
.page-hero p.lead{font-size:18px;color:#cfe0f5;margin-top:16px;max-width:680px;animation:heroFadeUp .6s ease .18s both;}
/* dark section directly under a dark banner: tighten the seam */
.page-hero + .solutions, .page-hero + .why{padding-top:40px;}

/* Presence page */
.province-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:48px;}
.province-card{background:var(--white);border:1px solid #e1e6ec;border-radius:16px;padding:26px 16px;text-align:center;box-shadow:var(--shadow);transition:transform .2s ease;}
.province-card:hover{transform:translateY(-4px);}
.province-card .num{font-size:34px;font-weight:800;color:var(--blue);}
.province-card .lbl{color:var(--gray-600);font-size:14px;font-weight:700;margin-top:4px;}
.province-groups{display:flex;flex-direction:column;gap:22px;}
.province-group{background:var(--white);border:1px solid #e8ecf1;border-radius:16px;padding:24px 26px;}
.province-group-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:16px;}
.province-group-head h4{font-size:19px;}
.province-group-head span{color:var(--gray-400);font-size:13.5px;font-weight:700;}
.city-pill-grid.left{justify-content:flex-start;max-width:none;}
.presence-note{text-align:center;color:var(--gray-600);font-size:14.5px;margin-top:28px;}

/* Solutions panel swap */
@keyframes panelSwap{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.challenge-panel.swap{animation:panelSwap .35s ease both;}

@media (max-width:980px){
  .province-stats{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .page-hero{padding:56px 0 48px;}
  .page-hero h1{font-size:32px;}
  .page-hero p.lead{font-size:16px;}
}
@media (prefers-reduced-motion:reduce){
  .page-hero::before,.page-hero .crumbs,.page-hero .eyebrow,.page-hero h1,.page-hero p.lead,.challenge-panel.swap{animation:none;}
}

/* Home: link through to the full catalogue page */
.catalogue-cta{text-align:center;margin-top:44px;}
.btn-pill-outline{
  display:inline-flex;align-items:center;gap:8px;padding:16px 32px;border-radius:999px;
  border:2px solid var(--blue);color:var(--blue);font-weight:800;font-size:16px;
  transition:background .2s ease, color .2s ease, transform .15s ease;
}
.btn-pill-outline:hover{background:var(--blue);color:#fff;transform:translateY(-2px);}

/* ---------- Managing Director message ---------- */
.md-section{background:var(--bg-soft-2);overflow:hidden;}
.md-grid{display:grid;grid-template-columns:380px 1fr;gap:64px;align-items:center;}
.md-photo{position:relative;padding:0 0 28px 0;}
.md-photo::before{
  content:"";position:absolute;top:-18px;left:-18px;right:18px;bottom:46px;border-radius:24px;
  background:linear-gradient(135deg,var(--blue),var(--teal));opacity:.9;
}
.md-photo-frame{
  position:relative;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:#dfe7f1;
  box-shadow:0 24px 50px rgba(15,28,51,0.18);
}
.md-photo-frame img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.md-photo:hover .md-photo-frame img{transform:scale(1.04);}
.md-photo-placeholder{display:none;}
.md-photo-frame.empty .md-photo-placeholder{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:linear-gradient(160deg,#e8eef6,#d6e2f0);color:var(--gray-600);
}
.md-photo-placeholder span{
  width:96px;height:96px;border-radius:50%;background:#fff;color:var(--blue);font-weight:800;font-size:32px;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);
}
.md-photo-placeholder small{font-weight:700;font-size:13px;letter-spacing:.04em;}
.md-badge{
  position:absolute;right:-22px;bottom:0;background:#fff;border-radius:16px;padding:14px 20px;
  box-shadow:0 14px 30px rgba(15,28,51,0.14);display:flex;flex-direction:column;
}
.md-badge strong{font-size:15.5px;color:var(--ink);}
.md-badge span{font-size:13px;color:var(--blue);font-weight:700;}
.md-content h2{font-size:36px;margin-top:16px;}
.md-quote{
  position:relative;margin:44px 0 22px;padding:6px 0 6px 28px;border-left:4px solid var(--teal);
  font-size:22px;line-height:1.55;font-weight:600;color:var(--navy);font-style:italic;
}
.md-quote-mark{
  position:absolute;top:-38px;left:14px;font-size:96px;line-height:1;font-style:normal;
  background:linear-gradient(135deg,var(--blue),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.35;
}
.md-body{color:var(--gray-600);font-size:16px;max-width:620px;}
.md-sign{display:flex;align-items:center;gap:16px;margin-top:30px;}
.md-sign-line{width:48px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--blue),var(--teal));}
.md-sign strong{display:block;font-size:17px;}
.md-sign span{color:var(--gray-600);font-size:14px;}
@media (max-width:980px){
  .md-grid{grid-template-columns:1fr;gap:48px;}
  .md-photo{max-width:340px;margin:0 auto;}
  .md-badge{right:-10px;}
}
@media (max-width:600px){
  .md-content h2{font-size:28px;}
  .md-quote{font-size:18px;padding-left:20px;}
  .md-badge{right:0;}
  .md-photo::before{top:-12px;left:-12px;right:12px;}
}