:root{
      /* Brand palette (matches rationfeed page) */
      --navy: #153755;
      --ice:  #DEE8F1;
      --orange: #F2953F;

      --bg: #ffffff;
      --surface: #F6FAFD;
      --ink: #071A2A;
      --muted: #314657;
      --line: rgba(21,55,85,.14);

      --header-h: 72px;

      --container: 1120px;
      --radius: 18px;
      --radius-sm: 14px;
      --shadow: 0 14px 40px rgba(0,0,0,.08);
      --shadow-sm: 0 8px 22px rgba(0,0,0,.08);

      --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
    }

    *{ box-sizing: border-box; }
    html{ scroll-behavior: smooth; }
    body{
      margin: 0;
      font-family: var(--font);
      color: var(--ink);
      background: var(--bg);
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      overflow-x: hidden;
    }

    .skip-link{
      position: absolute;
      left: 12px;
      top: 12px;
      padding: 10px 12px;
      border-radius: 999px;
      background: var(--ink);
      color: var(--bg);
      text-decoration: none;
      transform: translateY(-220%);
      transition: transform .15s ease;
      z-index: 3000;
    }
    .skip-link:focus{ transform: translateY(0); }

    :is(a, button, input, select, textarea, summary):focus-visible{
      outline: 3px solid var(--ink);
      outline-offset: 3px;
      box-shadow: 0 0 0 6px rgba(242,149,63,.22);
      border-radius: 12px;
    }

    a{
      color: inherit;
      text-decoration: underline;
      text-decoration-color: rgba(242,149,63,.55);
      text-decoration-thickness: 2px;
      text-underline-offset: .18em;
    }
    a:hover{ text-decoration-color: rgba(242,149,63,.95); }

    .container{
      max-width: var(--container);
      margin: 0 auto;
      padding: 0 20px;
    }
    .section{
      padding: clamp(60px, 6vw, 96px) 0;
    }
    .section.alt{
      background: linear-gradient(180deg, var(--surface), #ffffff);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .kicker{
      margin: 0 0 8px;
      font-weight: 950;
      letter-spacing: .10em;
      text-transform: uppercase;
      color: rgba(21,55,85,.70);
      font-size: 12px;
    }
    h2{
      margin: 0 0 12px;
      font-size: clamp(22px, 2.6vw, 34px);
      letter-spacing: -0.02em;
      line-height: 1.15;
      color: var(--navy);
    }
    .lead{
      margin: 0 0 18px;
      color: var(--muted);
      max-width: 80ch;
    }
    .small{
      color: var(--muted);
      font-size: 14px;
    }

    /* Header (same style as rationfeed page) */
    .header{
      position: sticky;
      top: 0;
      z-index: 2000;
      border-bottom: 1px solid rgba(21,55,85,.18);
      background: rgba(222,232,241,.65);
      backdrop-filter: blur(12px);
      transition: background .15s ease, box-shadow .15s ease;
    }
    .header[data-scrolled="true"]{
      background: rgba(222,232,241,.86);
      box-shadow: var(--shadow-sm);
    }
    .header-inner{
      min-height: var(--header-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }

    .brand{
      display: flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
      padding: 8px 10px;
      border-radius: 14px;
    }
    

    .brand-logo{
      height: 40px;
      width: auto;
      display: block;
    }
    .brand-tag{
      color: rgba(21,55,85,.70);
      font-weight: 800;
      font-size: 14px;
      letter-spacing: .01em;
      white-space: nowrap;
    }
    
    /* Smarter aquaculture boxed layout */
    .info-grid{
      margin-top: 16px;
display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
      align-items: stretch;
    }
    .info-box{
      padding: 16px;
    }
    .info-box h3{
      margin: 0 0 8px;
      font-size: 15px;
      letter-spacing: -0.01em;
    }

    /* Products 3-up tiles */
    .products-grid{
      margin-top: 22px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }
    .product-tile{
      border-radius: var(--radius);
      border: 1px solid rgba(21,55,85,.14);
      background: rgba(255,255,255,.92);
      padding: 18px;
      box-shadow: 0 1px 0 rgba(0,0,0,.02);
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
      position: relative;
      overflow: hidden;
      display: grid;
      gap: 10px;
      align-content: start;
    }
    .product-tile::before{
      content:"";
      position:absolute;
      inset: 0 0 auto 0;
      height: 4px;
      background: linear-gradient(90deg, var(--orange), rgba(242,149,63,.25));
      opacity: .9;
    }
    

    
    .tile-media{
      border-radius: 14px;
      overflow: hidden;
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(222,232,241,.35);
      aspect-ratio: 4 / 3;
    }
    .tile-media-link{
      display: block;
      text-decoration: none;
      color: inherit;
    }
    .tile-media-link:focus-visible{
      outline: 3px solid rgba(242,149,63,.7);
      outline-offset: 2px;
    }
    .tile-media img{
      width: 100%;
      height: 100%;
      object-fit: contain;
      display: block;
    }

    .product-tile .small{
      margin: 6px 0 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.6;
    }
    .tile-link{
      display: inline-flex;
      margin-top: 10px;
      font-weight: 900;
      color: rgba(21,55,85,.86);
      font-size: 15px;
      text-decoration: none;
    }
    .tile-link:hover{ color: var(--navy); text-decoration: underline; text-decoration-color: rgba(242,149,63,.55); text-underline-offset: .16em; }
    @media (hover:hover) and (pointer:fine){
      .product-tile:hover{
        transform: translateY(-2px);
        box-shadow: 0 18px 46px rgba(0,0,0,.10);
        border-color: rgba(21,55,85,.22);
        background: rgba(255,255,255,.98);
      }
    }

    /* Contact logo panel */
    .logo-panel{
      display: grid;
      place-items: center;
      padding: 18px;
      background: rgba(255,255,255,.92);
    }
    .logo-panel .logo-plate{
      width: min(320px, 86%);
      border-radius: 16px;
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(255,255,255,.92);
      padding: 16px;
      box-shadow: 0 10px 26px rgba(0,0,0,.06);
      display: grid;
      place-items: center;
    }
    .logo-panel img{ width: 100%; height: auto; display:block; }

    /* Team overlay: allow longer bios */
    .team-overlay{
      padding: 14px 14px 54px;
      overflow: auto;
    }
    .team-overlay p{
      font-size: 12.5px;
      line-height: 1.55;
      margin: 0;
      color: rgba(255,255,255,.94);
    }
    .team-overlay strong{
      display: inline-block;
      margin-bottom: 6px;
      font-size: 12.5px;
      color: #fff;
    }

    @media (max-width: 820px){
      .brand-tag{ display:none; }
      .brand-logo{ height: 34px; }
    }
.brand:hover{ text-decoration: none; }

    .brand-mark{
      width: 36px;
      height: 36px;
      border-radius: 14px;
      background:
        radial-gradient(circle at 22% 22%, rgba(255,255,255,.55), rgba(255,255,255,0) 58%),
        linear-gradient(135deg, var(--navy), rgba(21,55,85,.78));
      border: 1px solid rgba(7,26,42,.14);
      box-shadow: 0 0 0 4px rgba(21,55,85,.12);
      flex: none;
      position: relative;
      overflow: hidden;
    }
    .brand-mark::after{
      content:"";
      position:absolute;
      inset:-40% -30%;
      background: linear-gradient(135deg, rgba(242,149,63,.26), transparent 55%);
      transform: rotate(18deg);
    }

    .brand-text{
      display: flex;
      flex-direction: column;
      line-height: 1.05;
    }
    .brand-text strong{
      font-weight: 900;
      letter-spacing: -0.02em;
      color: var(--ink);
      font-size: 15px;
    }
    .brand-text span{
      margin-top: 2px;
      color: var(--muted);
      font-weight: 700;
      font-size: 13px;
      letter-spacing: .01em;
    }

    .nav-desktop{
      display: flex;
      align-items: center;
      gap: 4px;
      padding: 6px;
      border-radius: 999px;
      border: 1px solid rgba(21,55,85,.16);
      background: rgba(255,255,255,.55);
    }

    .nav-link{
      position: relative;
      text-decoration: none;
      padding: 10px 12px;
      border-radius: 999px;
      color: rgba(21,55,85,.85);
      font-weight: 850;
      font-size: 14px;
      letter-spacing: -0.01em;
      white-space: nowrap;
      transition: background .12s ease, color .12s ease;
    }
    .nav-link:hover{
      background: rgba(21,55,85,.08);
      color: var(--navy);
    }


    .nav-link::after{
      content:"";
      position:absolute;
      left: 14px;
      right: 14px;
      bottom: 6px;
      height: 2px;
      background: linear-gradient(90deg, var(--navy), var(--orange));
      border-radius: 999px;
      opacity: 0;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .14s ease, opacity .14s ease;
      pointer-events: none;
    }
    .nav-link[aria-current="page"]::after{
      opacity: 1;
      transform: scaleX(1);
    }
    .nav-link[aria-current="page"]{
      color: var(--navy);
      background: rgba(21,55,85,.10);
    }

    .nav-cta{
      display: flex;
      align-items: center;
      gap: 8px;
      flex: none;
    }
    .lang-switch{
      display: flex;
      align-items: center;
    }
    .lang-select{
      border: 1px solid rgba(21,55,85,.22);
      background: rgba(255,255,255,.7);
      color: var(--navy);
      border-radius: 999px;
      padding: 8px 10px;
      font-weight: 900;
      font-size: 12px;
      letter-spacing: .08em;
      cursor: pointer;
    }
    .sr-only{
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      border: 0;
      white-space: nowrap;
    }

    .btn{
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      border-radius: 999px;
      padding: 12px 16px;
      text-decoration: none;
      font-weight: 900;
      border: 1px solid transparent;
      cursor: pointer;
      line-height: 1;
      user-select: none;
      white-space: nowrap;
    }
    .btn.primary{
      background: var(--orange);
      color: #111;
      border-color: rgba(7,26,42,.12);
      box-shadow: 0 10px 20px rgba(242,149,63,.25);
    }
    .btn.primary:hover{ background: #f5a455; }

    .btn.ghost{
      border-color: rgba(21,55,85,.22);
      background: rgba(255,255,255,.55);
      color: var(--navy);
    }
    .btn.ghost:hover{ background: rgba(21,55,85,.06); }

    .menu-btn{
      display: none;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      border: 1px solid rgba(21,55,85,.18);
      background: rgba(255,255,255,.55);
      cursor: pointer;
      align-items: center;
      justify-content: center;
      flex: none;
    }
    .menu-btn svg{ width: 20px; height: 20px; }
    .header[data-open="true"] .menu-btn{
      background: rgba(21,55,85,.08);
      border-color: rgba(21,55,85,.22);
    }

    .mobile-drawer{
      border-top: 1px solid rgba(21,55,85,.16);
      background: rgba(222,232,241,.92);
      backdrop-filter: blur(12px);

      max-height: 0;
      overflow: clip;
      opacity: 0;
      transform: translateY(-4px);
      pointer-events: none;
      visibility: hidden;
      transition:
        max-height .22s ease,
        opacity .18s ease,
        transform .18s ease,
        visibility 0s linear .22s;
    }
    .header[data-open="true"] .mobile-drawer{
      max-height: 520px;
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
      visibility: visible;
      transition:
        max-height .22s ease,
        opacity .18s ease,
        transform .18s ease;
    }
    .mobile-nav{
      padding: 12px 0 18px;
      display: grid;
      gap: 6px;
    }
    .mobile-link{
      text-decoration: none;
      padding: 12px 12px;
      border-radius: 14px;
      color: rgba(21,55,85,.88);
      font-weight: 900;
      letter-spacing: -0.01em;
      transition: background .12s ease, color .12s ease;
    }
    .mobile-link:hover{
      background: rgba(21,55,85,.10);
      color: var(--navy);
    }
    .mobile-link[aria-current="page"]{
      background: rgba(21,55,85,.12);
      color: var(--navy);
    }
    .mobile-cta{
      display: grid;
      gap: 10px;
      margin-top: 10px;
      padding: 8px 12px 0;
    }

    /* Home hero */
    .home-hero{
      position: relative;
      overflow: hidden;
      min-height: clamp(540px, 78vh, 780px);
      display: grid;
      align-items: center;
      padding: clamp(64px, 7vw, 92px) 0 120px;
      background:
        linear-gradient(0deg, rgba(0,0,0,.58), rgba(0,0,0,.52)),
        url("../home-hero-bg.png");
      background-size: cover;
      background-position: center;
    }
    .home-hero::after{
      content:"";
      position:absolute;
      inset:-160px -160px -260px -160px;
      background:
        radial-gradient(circle at 20% 35%, rgba(255,255,255,.18), transparent 42%),
        radial-gradient(circle at 68% 28%, rgba(255,255,255,.12), transparent 46%),
        radial-gradient(circle at 80% 62%, rgba(242,149,63,.18), transparent 48%);
      filter: blur(26px);
      opacity: .55;
      pointer-events:none;
    }
    .hero-inner{
      position: relative;
      z-index: 1;
      text-align: center;
      display: grid;
      gap: 14px;
      justify-items: center;
      max-width: 78ch;
      margin: 0 auto;
      color: #fff;
    }
    .hero-inner h1{
      margin: 0;
      font-size: clamp(34px, 6.2vw, 60px);
      letter-spacing: -0.03em;
      line-height: 1.06;
      text-shadow: 0 12px 30px rgba(0,0,0,.45);
      max-width: 24ch;
    }
    .shine-text{
      display: inline-block;
      color: #fff;
      background: linear-gradient(120deg, rgba(255,255,255,.9) 0%, rgba(120,190,255,.95) 25%, rgba(255,255,255,.9) 50%, rgba(120,190,255,.75) 70%, rgba(255,255,255,.9) 100%);
      background-size: 240% 100%;
      animation: text-shine 12s ease-in-out infinite;
    }
    @supports ((-webkit-background-clip: text) or (background-clip: text)) {
      .shine-text{
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
    }
    .hero-inner p{
      margin: 0;
      max-width: 74ch;
      color: rgba(255,255,255,.90);
      font-size: clamp(14px, 1.9vw, 18px);
      text-shadow: 0 10px 24px rgba(0,0,0,.35);
    }

    /* Floating value card */
    .float-wrap{
      margin-top: -88px;
      position: relative;
      z-index: 2;
    }
    .value-card{
      background: rgba(255,255,255,.98);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      border: 1px solid rgba(21,55,85,.12);
      padding: 26px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }
    .value{
      display: grid;
      grid-template-columns: 52px 1fr;
      gap: 12px;
      align-items: start;
      padding: 6px 0;
    }
    .icon{
      width: 50px;
      height: 50px;
      border-radius: 14px;
      display: grid;
      place-items: center;
      background: rgba(242,149,63,.12);
      border: 1px solid rgba(242,149,63,.30);
      flex: none;
    }
    .icon svg{ width: 22px; height: 22px; }
    .value h3{
      margin: 0 0 4px;
      color: var(--navy);
      font-size: 14px;
      letter-spacing: -0.01em;
    }
    .value p{
      margin: 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.55;
    }

    /* Content layouts */
    .grid-2{
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 28px;
      align-items: start;
    }
    .big-title{
      margin: 0;
      font-size: clamp(28px, 3.6vw, 44px);
      line-height: 1.12;
      letter-spacing: -0.02em;
      color: var(--navy);
    }

    .card{
      background: rgba(255,255,255,.94);
      border: 1px solid rgba(21,55,85,.14);
      border-radius: var(--radius);
      padding: 22px;
      box-shadow: 0 1px 0 rgba(0,0,0,.02);
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
      will-change: transform;
    }
    .card h3{
      margin: 0 0 8px;
      font-size: 18px;
      letter-spacing: -0.01em;
      color: var(--navy);
    }
    .card p{ margin: 0; color: var(--muted); }

    @media (hover:hover) and (pointer:fine){
      .card:hover{
        transform: translateY(-2px);
        box-shadow: 0 18px 46px rgba(0,0,0,.10);
        border-color: rgba(21,55,85,.22);
        background: rgba(255,255,255,.98);
      }
    }

    /* Product highlight */
    
    /* Smarter aquaculture info card spacing */
    .info-card h3{
      font-size: 16px;
      margin: 0 0 6px;
    }
    .info-card p{
      margin: 0;
      color: var(--muted);
    }
    .info-card h3 + p{ margin-bottom: 14px; }
    .info-card h3:last-of-type + p{ margin-bottom: 0; }

.product-highlight{
      margin-top: 28px;
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 22px;
      align-items: center;
      padding: 24px;
      border-radius: var(--radius);
      border: 1px solid rgba(21,55,85,.14);
      background: rgba(255,255,255,.92);
      box-shadow: 0 12px 34px rgba(0,0,0,.06);
    }
    .product-highlight h3{
      margin: 0 0 8px;
      color: var(--navy);
      font-size: 22px;
      letter-spacing: -0.01em;
    }
    .bullets{
      margin: 10px 0 14px;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 8px;
    }
    .bullets li{
      display: grid;
      grid-template-columns: 16px 1fr;
      gap: 10px;
      align-items: start;
      color: var(--muted);
      font-size: 13.5px;
    }
    .dot{
      width: 10px;
      height: 10px;
      margin-top: 4px;
      border-radius: 50%;
      background: var(--orange);
      box-shadow: 0 0 0 4px rgba(242,149,63,.16);
    }
    .product-media{
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(222,232,241,.35);
      aspect-ratio: 4 / 3;
    }
    .product-media img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    /* Contact band (integrated callout panel) */
    .cta-band{
      padding: 60px 0 72px;
      background: linear-gradient(180deg, #f6f8fb, #eef3f8);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }
    .cta-inner{
      background: linear-gradient(135deg, #0b2a4a, #133c5c 70%);
      color: #fff;
      border-radius: 24px;
      padding: 34px 38px;
      display: grid;
      grid-template-columns: 1.4fr auto;
      gap: 22px;
      align-items: center;
      max-width: 980px;
      margin: 0 auto;
      text-align: center;
      box-shadow: 0 24px 70px rgba(11,42,74,.25);
      position: relative;
      overflow: hidden;
    }
    .cta-inner::after{
      content:"";
      position:absolute;
      inset: -40% -20% auto auto;
      width: 280px;
      height: 280px;
      background: radial-gradient(circle, rgba(242,149,63,.45), transparent 65%);
      opacity: .55;
      pointer-events: none;
    }
    .cta-copy h2{
      margin: 0 0 6px;
      color: #fff;
      text-align: center;
    }
    .cta-copy p{
      margin: 0;
      color: rgba(255,255,255,.85);
      max-width: 70ch;
      font-size: 14px;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }
    .cta-actions{
      display: flex;
      justify-content: center;
    }
    .cta-email{
      display: none;
      font-weight: 900;
      margin-top: 8px;
      color: var(--orange);
    }
    .cta-email a{
      color: inherit;
      text-decoration-color: rgba(242,149,63,.8);
    }

    /* About section */
    .section.about{
      padding-top: clamp(52px, 5vw, 84px);
      padding-bottom: clamp(46px, 5vw, 72px);
    }
    .about-header{
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 24px;
      align-items: start;
    }
    .about-intro .lead{
      margin-bottom: 0;
    }
    .about-panel{
      display: grid;
      gap: 14px;
    }
    .about-card{
      border-radius: var(--radius);
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(255,255,255,.92);
      padding: 16px;
      box-shadow: 0 12px 30px rgba(0,0,0,.06);
    }
    .about-card h3{
      margin: 0 0 6px;
      color: var(--ink);
      font-size: 14px;
      font-weight: 950;
    }
    .about-card p{
      margin: 0;
      color: var(--muted);
      font-size: 13.5px;
      line-height: 1.6;
    }
    .about-team{
      margin-top: 26px;
    }
    .logo-tile{
      margin-top: 18px;
      border-radius: var(--radius-sm);
      overflow: hidden;
      border: 1px solid rgba(21,55,85,.12);
      background: linear-gradient(180deg, rgba(242,149,63,.92), rgba(21,55,85,.92));
      position: relative;
      min-height: 220px;
      display: grid;
      place-items: center;
    }
    .logo-tile::after{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height: 44%;
      background:
        radial-gradient(circle at 16px 12px, rgba(255,255,255,.12) 18px, transparent 19px) 0 0 / 64px 64px repeat-x;
      opacity: .65;
    }
    

    .logo-plate{
      position: relative;
      z-index: 1;
      background: rgba(255,255,255,.92);
      border: 1px solid rgba(255,255,255,.55);
      border-radius: 16px;
      padding: 18px 20px;
      box-shadow: 0 18px 40px rgba(0,0,0,.18);
      display: grid;
      place-items: center;
      width: min(520px, 92%);
      margin: 0 auto;
    }
    .logo-plate img{
      width: min(360px, 92%);
      height: auto;
      display: block;
    }
.logo-tile .logo{
      position: relative;
      z-index: 1;
      display: grid;
      gap: 10px;
      justify-items: center;
      color: #fff;
    }
    .logo-tile .logo .mark{
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-weight: 950;
      letter-spacing: -0.03em;
      font-size: 44px;
      text-transform: lowercase;
    }
    .about-media{
      border-radius: var(--radius);
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(222,232,241,.35);
      box-shadow: 0 10px 26px rgba(0,0,0,.06);
      padding: 18px;
      display: grid;
      place-items: center;
    }
    .about-media img{
      width: min(380px, 100%);
      height: auto;
      display: block;
      border-radius: 14px;
      border: 1px solid rgba(21,55,85,.10);
      background: #fff;
    }

    /* Team cards */
    .team-grid{
      margin-top: 22px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      max-width: 960px;
      margin-left: auto;
      margin-right: auto;
    }
    .team-card{
      position: relative;
      border-radius: 12px;
      overflow: hidden;
      border: 1px solid rgba(21,55,85,.12);
      background: #fff;
      box-shadow: 0 10px 24px rgba(0,0,0,.06);
      transition: transform .18s ease, box-shadow .18s ease;
      display: flex;
      flex-direction: column;
    }
    @media (hover:hover) and (pointer:fine){
      .team-card:hover{
        transform: translateY(-2px);
        box-shadow: 0 18px 40px rgba(0,0,0,.10);
      }
    }
    .team-media{
      position: relative;
      height: 240px;
      overflow: hidden;
      border-radius: 12px 12px 0 0;
      background: rgba(222,232,241,.35);
      border-bottom: 1px solid rgba(21,55,85,.10);
    }
    .team-media img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: filter .18s ease, transform .18s ease;
    }
    .team-bar{
      display:flex;
      align-items:flex-start;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 10px 12px;
      color: #fff;
      font-weight: 900;
      font-size: 12px;
    }
    .team-text{
      display: grid;
      gap: 4px;
    }
    .team-name{
      font-size: 13px;
      font-weight: 900;
      line-height: 1.2;
    }
    .team-title{
      font-size: 12px;
      font-weight: 800;
      opacity: 0.9;
      line-height: 1.2;
    }
    .team-bar.blue{ background: var(--navy); }
    .team-bar.orange{ background: var(--orange); color: #111; }
    .team-bar .mini{
      width: 18px;
      height: 18px;
      border-radius: 6px;
      display:grid;
      place-items:center;
      background: rgba(255,255,255,.16);
      border: 1px solid rgba(255,255,255,.20);
      flex: none;
    }
    .team-bar.orange .mini{
      background: rgba(0,0,0,.10);
      border-color: rgba(0,0,0,.10);
    }
    .team-bar svg{ width: 12px; height: 12px; }
    .team-bar span{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }


    
    .team-overlay{
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      padding: 18px 14px 20px;
      overflow: auto;
      display: flex;
      align-items: flex-end;
      background: linear-gradient(180deg, rgba(7,26,42,0) 10%, rgba(7,26,42,.94) 100%);
      opacity: 0;
      transform: translateY(6px);
      transition: opacity .18s ease, transform .18s ease;
      pointer-events: none;
    }
    .team-overlay p{
      margin: 0;
      color: rgba(255,255,255,.92);
      font-size: 14px;
      line-height: 1.5;
    }
    @media (hover:hover) and (pointer:fine){
      .team-card:hover .team-overlay{
        opacity: 1;
        transform: translateY(0);
      }
      .team-card:hover img{
        filter: blur(2px) brightness(0.65);
      }
      .team-card:hover .team-bar{
        background: var(--orange);
        color: #111;
      }
      .team-card:hover .team-bar .mini{
        background: rgba(0,0,0,.10);
        border-color: rgba(0,0,0,.10);
      }
    }
    .team-card:focus-visible{
      outline: 3px solid var(--ink);
      outline-offset: 3px;
    }
    .team-card:focus-visible .team-overlay{
      opacity: 1;
      transform: translateY(0);
    }
    .team-card:focus-visible img{
      filter: blur(2px) brightness(0.65);
    }
    .team-card:focus-visible .team-bar{
      background: var(--orange);
      color: #111;
    }
    .team-card:focus-visible .team-bar .mini{
      background: rgba(0,0,0,.10);
      border-color: rgba(0,0,0,.10);
    }

    @keyframes text-shine{
      0%{ background-position: 200% 0; }
      50%{ background-position: 0% 0; }
      100%{ background-position: -200% 0; }
    }

    /* Contact form */
    .contact-title{
      text-align: center;
      color: var(--navy);
      margin: 0 0 18px;
      font-size: clamp(22px, 3vw, 34px);
      font-weight: 950;
      letter-spacing: -0.02em;
    }
    .contact-grid{
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 22px;
      align-items: start;
    }
    .form-card{
      border: 1px solid rgba(21,55,85,.12);
      border-radius: var(--radius-sm);
      background: #fff;
      padding: 18px;
      box-shadow: 0 10px 26px rgba(0,0,0,.05);
    }
    .form-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }
    label{
      display:block;
      font-size: 12px;
      font-weight: 900;
      color: rgba(21,55,85,.72);
      margin-bottom: 6px;
    }
    input, textarea{
      width: 100%;
      border: 1px solid rgba(21,55,85,.16);
      border-radius: 12px;
      padding: 12px 12px;
      font: inherit;
      background: rgba(255,255,255,.96);
    }
    textarea{ min-height: 98px; resize: vertical; grid-column: 1 / -1; }
    .full{ grid-column: 1 / -1; }

    .checks{
      display:grid;
      gap: 6px;
      margin-top: 8px;
      color: var(--muted);
      font-size: 13px;
    }
    .checkline{ display:flex; gap: 8px; align-items: center; }
    .checkline input{ width: 16px; height: 16px; }

    .form-actions{
      margin-top: 12px;
      display:flex;
      justify-content: flex-start;
    }

    .contact-media{
      border-radius: var(--radius-sm);
      border: 1px solid rgba(21,55,85,.12);
      background: rgba(222,232,241,.35);
      box-shadow: 0 10px 26px rgba(0,0,0,.06);
      padding: 18px;
      display: grid;
      place-items: center;
    }
    .contact-media img{
      width: min(420px, 100%);
      height: auto;
      display: block;
      border-radius: 12px;
      border: 1px solid rgba(21,55,85,.10);
      background: #fff;
    }

    /* Footer banner */
    .footer-banner{
      background: #0b2a4a;
      color: #f4f7fb;
      padding: 48px 0 28px;
      border-top: none;
    }
    .footer-banner a{
      color: #f4f7fb;
      text-decoration: none;
    }
    .footer-banner a:hover{ text-decoration: underline; text-underline-offset: .15em; }
    .footer-banner-grid{
      display: grid;
      grid-template-columns: 1.05fr 1.4fr 1.1fr;
      gap: 28px;
      align-items: start;
    }
    .footer-logo-large{
      height: 48px;
      width: auto;
      display: block;
    }
    .footer-address{
      margin: 12px 0 0;
      line-height: 1.6;
      color: rgba(255,255,255,.78);
      font-size: 14px;
    }
    .footer-about h3,
    .footer-partners h3{
      margin: 0 0 10px;
      font-size: 20px;
      letter-spacing: -0.02em;
      color: #fff;
    }
    .footer-about p{
      margin: 0 0 10px;
      line-height: 1.6;
      color: rgba(255,255,255,.84);
    }
    .footer-about-cta{
      margin-top: 12px;
      font-weight: 900;
      color: #fff;
    }
    .partners-grid{
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px 22px;
      align-items: center;
    }
    .partner-logo{
      max-height: 52px;
      width: auto;
      display: block;
      filter: brightness(0) invert(1);
      opacity: .9;
    }
    .partner-logo.mikra{
      max-height: 38px;
    }
    .partner-logo.tall{
      max-height: 92px;
    }
    .footer-bottom{
      border-top: 1px solid rgba(255,255,255,.12);
      margin-top: 26px;
      padding-top: 16px;
    }
    .footer-banner .small{
      color: rgba(255,255,255,.68);
      font-size: 13px;
    }

    /* Responsive */
    @media (max-width: 980px){
      .value-card{ grid-template-columns: 1fr; }
      .grid-2{ grid-template-columns: 1fr; }
      .product-highlight{
      margin-top: 28px; grid-template-columns: 1fr; }
      .about-grid{ grid-template-columns: 1fr; }
      .about-header{ grid-template-columns: 1fr; }
      .team-grid{ grid-template-columns: 1fr 1fr; }
      .contact-grid{ grid-template-columns: 1fr; }
      .footer-banner-grid{ grid-template-columns: 1fr; }
      .partners-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .cta-inner{
        grid-template-columns: 1fr;
        padding: 28px;
      }
      .cta-actions{
        justify-content: flex-start;
      }
    }
    @media (max-width: 860px){
      .nav-desktop{ display:none; }
      .nav-cta{ display:none; }
      .menu-btn{ display:inline-flex; }
    }
    @media (max-width: 520px){
      .team-grid{ grid-template-columns: 1fr; }
      .form-grid{ grid-template-columns: 1fr; }
      .partners-grid{ grid-template-columns: 1fr; }
    }
    
    @media (max-width: 980px){
      .products-grid{ grid-template-columns: 1fr; }
      .info-grid{ grid-template-columns: 1fr; }
    }

    @media (prefers-reduced-motion: reduce){
      html{ scroll-behavior: auto; }
      *{ transition: none !important; }
    }

    :is(section, footer){ scroll-margin-top: calc(var(--header-h) + 18px); }