/* Sustainable NValue — Contact page styles */

    :root{
      --ink:#102637;
      --panel:#132A47;
      --steel:#3B6A94;
      --amber:#E07A3E;
      --amber-deep:#B0531C;
      --paper:#F6F7F9;
      --slate:#2B3440;
      --slate-soft:#5B6672;
      --line:#E1E4E8;
    }
    *{box-sizing:border-box; margin:0; padding:0;}
    html{scroll-behavior:smooth;}
    body{
      font-family:'Inter', system-ui, sans-serif;
      color:var(--slate);
      background:var(--paper);
      -webkit-font-smoothing:antialiased;
    }
    h1,h2,h3,.display{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.01em;}
    .eyebrow{
      font-size:0.72rem; font-weight:600; letter-spacing:0.18em;
      text-transform:uppercase; color:var(--amber-deep);
    }
    a{color:inherit; text-decoration:none;}
    .wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

    header{
      position:fixed; top:0; left:0; right:0; z-index:50;
      transition:background .35s ease, box-shadow .35s ease, padding .35s ease;
      padding:22px 0;
    }
    header.scrolled{
      background:rgba(11,30,54,0.92);
      backdrop-filter:blur(10px);
      box-shadow:0 1px 0 rgba(255,255,255,0.06);
      padding:14px 0;
    }
    nav{display:flex; align-items:center; justify-content:space-between;}
    .logo{display:flex; align-items:center; gap:10px; font-weight:700; color:#fff; font-size:1.05rem;}
    .logo-mark-img{height:42px; width:auto; display:block; transition:height .35s ease;}
    header.scrolled .logo-mark-img{height:32px;}
    .navlinks{display:flex; align-items:center; gap:36px;}
    .navlinks a{
      color:rgba(255,255,255,0.82); font-size:0.9rem; font-weight:500;
      position:relative; padding:4px 0; text-decoration:none;
    }
    .navlinks a::after{
      content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px;
      background:var(--amber); transition:width .3s ease;
    }
    .navlinks a.active{color:var(--amber);}
    .navlinks a:not(.active):hover{color:#fff;}
    .navlinks a:hover::after, .navlinks a.active::after{width:100%;}
    .navlinks a:focus-visible{outline:2px solid var(--amber); outline-offset:4px; border-radius:2px;}
    .menu-toggle:focus-visible{outline:2px solid var(--amber); outline-offset:3px; border-radius:12px;}

    .hero{
      position:relative; min-height:60vh;
      background-image:url('../images/hero-contact.jpg');
      background-size:cover; background-position:center;
      display:flex; align-items:center; overflow:hidden;
    }
    .hero-overlay{
      position:absolute; inset:0;
      background:linear-gradient(115deg, rgba(16,38,55,0.72) 0%, rgba(20,42,64,0.62) 38%, rgba(34,64,90,0.55) 100%);
    }
    .hero-content{position:relative; z-index:2; padding-top:80px; padding-bottom:60px;}
    .hero h1{color:#fff; font-weight:700; font-size:clamp(2.6rem, 5.8vw, 4.4rem); line-height:1.05;}
    .hero .sub{color:#B9C6D6; font-weight:500; font-size:clamp(1.2rem, 2.4vw, 1.8rem); margin-top:6px;}
    .divider{width:64px; height:3px; background:var(--amber); border-radius:2px; margin:26px 0;}
    .hero .tagline{color:#fff; font-weight:600; font-size:clamp(1rem,1.6vw,1.15rem); letter-spacing:0.02em;}

    section{padding:90px 0;}
    .section-head{max-width:640px; margin-bottom:46px;}
    .section-head h2{font-size:clamp(1.8rem,3.2vw,2.5rem); color:var(--ink); font-weight:700; margin-top:10px; line-height:1.15;}
    .section-head p{color:var(--slate-soft); margin-top:14px; font-size:1.02rem; line-height:1.6;}

    form{width:100%;}
    input, textarea{
      width:100%; padding:13px 16px; border:1px solid var(--line);
      border-radius:10px; font-family:inherit; font-size:0.95rem;
      background:#fff; color:var(--slate);
    }
    textarea{resize:vertical;}
    label{display:block; font-size:0.85rem; font-weight:600; color:var(--ink); margin-bottom:8px;}

    .btn-dark{
      display:inline-block; margin-top:26px; background:var(--amber); color:#fff;
      padding:15px 34px; border-radius:999px; font-weight:600; font-size:0.95rem;
      transition:transform .25s ease, box-shadow .25s ease;
      border:none; cursor:pointer;
    }
    .btn-dark:hover{transform:translateY(-3px); box-shadow:0 20px 40px -18px rgba(16,38,55,0.5);}

    .cta-band{background:#08182D; text-align:center;}
    .cta-band h2{color:#fff; font-size:clamp(1.6rem,3vw,2.2rem); font-weight:700;}
    .cta-band p{color:rgba(255,255,255,0.85); margin-top:12px; font-size:1.02rem;}

    footer{background:#08182D; color:#8FA4BC; padding:56px 0 28px;}
    .footer-top{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,0.08);}
    .footer-top .tag{color:#fff; font-family:'Space Grotesk',sans-serif; font-size:1.15rem; font-weight:600; max-width:320px;}
    .footer-links{display:flex; gap:28px; font-size:0.88rem;}
    .footer-links a:hover{color:#fff;}

    .menu-toggle{
      display:none; flex-direction:column; justify-content:center; align-items:center;
      gap:5px; width:44px; height:44px; cursor:pointer;
      padding:0; -webkit-tap-highlight-color:transparent; position:relative; z-index:210;
      background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.16); border-radius:12px;
      transition:background .3s ease, border-color .3s ease, transform .2s ease;
    }
    .menu-toggle:hover{background:rgba(255,255,255,0.18);}
    .menu-toggle:active{transform:scale(0.93);}
    .menu-toggle[aria-expanded="true"]{background:var(--amber); border-color:var(--amber);}
    .menu-toggle-bar{
      display:block; width:20px; height:2px; background:#fff; border-radius:2px;
    }

    .mobile-menu-overlay{
      display:none; position:fixed; inset:0; background:rgba(6,14,26,0.6);
      -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
      opacity:0; visibility:hidden; transition:opacity .35s ease, visibility 0s linear .35s;
      z-index:190;
    }
    .mobile-menu-overlay.open{
      opacity:1; visibility:visible; transition:opacity .35s ease, visibility 0s linear 0s;
    }
    .mobile-menu-panel{
      display:none; position:fixed; top:0; right:0; bottom:0; width:min(86vw, 380px);
      background:linear-gradient(165deg, #0C2035 0%, #132A47 48%, #0D2740 100%);
      box-shadow:-32px 0 80px -20px rgba(0,0,0,0.55);
      border-left:1px solid rgba(255,255,255,0.08);
      transform:translateX(100%); visibility:hidden;
      transition:transform .4s cubic-bezier(.4,0,.2,1), visibility 0s linear .4s;
      z-index:200; flex-direction:column;
    }
    .mobile-menu-panel.open{
      visibility:visible; transform:translateX(0);
      transition:transform .4s cubic-bezier(.4,0,.2,1), visibility 0s linear 0s;
    }
    .mobile-menu-header{
      display:flex; align-items:center; justify-content:space-between;
      padding:22px 22px 20px; border-bottom:1px solid rgba(255,255,255,0.08);
    }
    .mobile-menu-header .logo-mark-img{height:34px; width:auto; display:block;}
    .mobile-menu-close{
      width:40px; height:40px; border-radius:12px; cursor:pointer;
      background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14);
      color:#fff; font-size:1.25rem; line-height:1; display:flex; align-items:center; justify-content:center;
      transition:background .25s ease, border-color .25s ease, transform .2s ease;
    }
    .mobile-menu-close:hover{background:rgba(255,255,255,0.16);}
    .mobile-menu-close:active{transform:scale(0.92);}
    .mobile-menu-links{display:flex; flex-direction:column; padding:6px 0;}
    .mobile-menu-links a{
      display:block; padding:18px 26px; font-size:1.05rem; font-weight:700;
      color:rgba(255,255,255,0.78); border-bottom:1px solid rgba(255,255,255,0.06);
      border-left:3px solid transparent;
      transition:color .25s ease, background .25s ease, border-left-color .25s ease, padding-left .25s ease;
    }
    .mobile-menu-links a:not(.active):hover{color:#fff; padding-left:32px; background:rgba(255,255,255,0.03);}
    .mobile-menu-links a.active{color:#fff; background:rgba(224,122,62,0.1); border-left-color:var(--amber);}
    .mobile-menu-links a:focus-visible{outline:2px solid var(--amber); outline-offset:-2px;}
    .mobile-menu-footer{margin-top:auto; padding:22px;}
    .mobile-menu-cta{
      display:flex; align-items:center; justify-content:center; gap:10px;
      width:100%; padding:17px 22px; border-radius:999px;
      background:var(--amber); color:#fff; font-weight:700; font-size:1rem;
      box-shadow:0 16px 32px -12px rgba(224,122,62,0.55);
      transition:background .25s ease, transform .25s ease, box-shadow .25s ease;
    }
    .mobile-menu-cta:hover{background:var(--amber-deep); transform:translateY(-2px);}
    .mobile-menu-cta:focus-visible{outline:2px solid #fff; outline-offset:2px;}

    @media (max-width:720px){
      .menu-toggle{display:flex;}
      .navlinks{display:none;}
      .mobile-menu-overlay{display:block;}
      .mobile-menu-panel{display:flex;}
      .hero-content{padding-top:96px; padding-bottom:70px;}
      section{padding:70px 0;}
    }