/* Shared base for all NQ concepts */
:root{
  --red:#D24262; --red-dk:#B8304E; --teal:#16A9C9; --teal-lt:#41BED1; --teal-dk:#0E7F98;
  --ink:#1E1F26; --ink-2:#2B2C33; --char:#4D4D4F; --mute:#6B6D74; --line:#E3E6EA; --mist:#F4F6F8; --white:#fff;
  --f-display:"Michroma",system-ui,sans-serif; --f-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);font-size:17px;line-height:1.6;color:var(--char);background:#fff;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.15;color:var(--ink);text-wrap:balance}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.ic{width:24px;height:24px;flex:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px}

/* concept banner (remove on live site) */
.concept-bar{background:#FFF6D6;color:#5a4a00;font-size:13px;text-align:center;padding:6px 16px;font-family:var(--f-body)}
.concept-bar a{font-weight:600}

/* photo placeholders */
.ph{position:relative;overflow:hidden;min-height:160px;background:linear-gradient(135deg,#252731 0%,#30505c 100%);display:flex;align-items:flex-end;color:#fff}
.ph::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.05) 0 2px,transparent 2px 22px)}
.ph::after{content:"";position:absolute;right:-12%;top:-30%;width:55%;height:160%;background:linear-gradient(115deg,transparent 0 30%,rgba(65,190,209,.22) 30% 55%,rgba(210,66,98,.18) 55% 70%,transparent 70%);transform:skewX(-20deg)}
.ph-t1{background:linear-gradient(135deg,#0f6f86 0%,#41BED1 100%)}
.ph-t2{background:linear-gradient(135deg,#2B2C33 0%,#7a2c40 100%)}
.ph-t3{background:linear-gradient(160deg,#3a4a52 0%,#16A9C9 140%)}
.ph-tag{position:relative;z-index:1;display:flex;gap:10px;align-items:flex-start;margin:14px;padding:8px 12px;background:rgba(20,21,27,.55);backdrop-filter:blur(4px);border-radius:6px;font-size:13px;line-height:1.35;max-width:calc(100% - 28px)}
.ph-ic{width:18px;height:18px;flex:none;margin-top:1px;opacity:.85}
.ph-lbl{display:block;font-weight:600}
.ph-sub{display:block;opacity:.8}

/* header mechanics */
.site-header{position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;gap:24px}
.logo img{height:52px;width:auto}
.site-nav{margin-left:auto}
.site-nav>ul{display:flex;gap:4px;align-items:center}
.site-nav a{text-decoration:none}
.has-dd{position:relative;display:flex;align-items:center}
.dd-toggle{background:none;border:0;color:inherit;padding:4px;cursor:pointer;display:flex}
.dd-toggle .ic{width:18px;height:18px}
.dd{position:absolute;top:100%;left:-12px;min-width:310px;padding:8px;display:none;z-index:60}
.has-dd:hover .dd,.has-dd:focus-within .dd,.has-dd.dd-open .dd{display:block}
.dd a{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:6px;white-space:nowrap}
.badge{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--red);color:#fff;padding:2px 7px;border-radius:20px;line-height:1.4;font-family:var(--f-body)}
.menu-btn{display:none;background:none;border:0;color:inherit;cursor:pointer;padding:8px;margin-left:auto}
.menu-btn .ic{width:28px;height:28px}

@media (max-width:960px){
  .menu-btn{display:flex}
  .site-nav{position:fixed;inset:0 0 0 auto;width:min(86vw,360px);transform:translateX(100%);transition:transform .25s ease;overflow-y:auto;padding:84px 20px 32px;margin:0;z-index:55}
  .site-nav.open{transform:none;box-shadow:-20px 0 60px rgba(0,0,0,.35)}
  .site-nav>ul{flex-direction:column;align-items:stretch;gap:0}
  .site-nav>ul>li>a{display:block;padding:14px 8px;font-size:18px}
  .has-dd{flex-wrap:wrap}
  .has-dd>a{flex:1}
  .dd a{white-space:normal}
  .dd{position:static;display:none;min-width:0;width:100%;box-shadow:none;padding:0 0 8px 8px;background:transparent!important}
  .has-dd:hover .dd,.has-dd:focus-within .dd{display:none}
  .has-dd.dd-open .dd{display:block}
  .menu-btn{position:relative;z-index:60}
  .header-cta{display:none!important}
  .logo img{height:44px}
}

/* forms */
.enquiry{display:grid;gap:14px}
.enquiry label{display:grid;gap:6px;font-weight:600;font-size:15px;color:var(--ink)}
.enquiry input,.enquiry textarea,.enquiry select{font:inherit;font-weight:400;padding:12px 14px;border:1px solid #cfd4da;border-radius:6px;background:#fff;color:var(--ink);width:100%}
.enquiry textarea{min-height:140px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{font-size:14px;background:#E8F7FA;border-left:3px solid var(--teal);padding:10px 12px;margin:0}
@media (max-width:640px){.form-row{grid-template-columns:1fr}}

.draft-note{font-size:13px;background:#FFF6D6;color:#5a4a00;border-radius:6px;padding:8px 12px;display:inline-block;margin-bottom:16px}