/* Sakha Energy shared stylesheet (PREVIEW).
   1. Styles of the live home page, unchanged.
   2. Components of the About, Services and Case studies pages.
   3. Site navigation, VEN Management page and Letter of Authority form. */

:root{
  --ink:#14363d; --ink-2:#2c5159; --muted:#5b6b6e;
  --sun:#f2a33a; --sun-deep:#d9861a; --leaf:#3f8f7a;
  --bg:#faf7f2; --card:#ffffff; --line:#e7e1d6;
  --radius:14px; --max:1120px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;font-size:17px}
a{color:var(--ink);text-underline-offset:3px}
img,svg{max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
button{font:inherit;cursor:pointer}
.btn{display:inline-block;padding:12px 22px;border-radius:999px;font-weight:600;text-decoration:none;border:2px solid transparent;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--sun);color:#1b1b1b}
.btn-primary:hover{background:var(--sun-deep)}
.btn-ghost{border-color:var(--ink);color:var(--ink)}
.eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);font-weight:700;margin:0 0 10px}
h1,h2,h3{line-height:1.2;margin:0 0 14px}
h1{font-size:clamp(34px,5.2vw,56px);letter-spacing:-.02em}
h2{font-size:clamp(26px,3.4vw,36px);letter-spacing:-.01em}
h3{font-size:20px}
section{padding:80px 0}

/* header */
header{position:sticky;top:0;z-index:10;background:rgba(250,247,242,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:20px;letter-spacing:-.01em}
.brand small{font-weight:500;color:var(--muted);font-size:14px}
.nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.nav ul a{text-decoration:none;font-weight:500;color:var(--ink-2)}
.nav ul a:hover{color:var(--ink)}
@media (max-width:760px){.nav ul{display:none}}

/* hero */
.hero{padding:88px 0 72px;background:
  radial-gradient(900px 420px at 85% -10%, rgba(242,163,58,.22), transparent 60%),
  radial-gradient(700px 380px at -10% 110%, rgba(63,143,122,.14), transparent 60%)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.hero p.lead{font-size:20px;color:var(--ink-2);max-width:40ch}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.meaning{margin-top:26px;font-size:15px;color:var(--muted)}
.meaning b{color:var(--ink)}
.hero-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 20px 50px -30px rgba(20,54,61,.45)}
.hero-card h3{font-size:15px;color:var(--muted);font-weight:600;margin-bottom:6px}
.stat{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:1px solid var(--line)}
.stat:first-of-type{border-top:0}
.stat span{color:var(--muted);font-size:15px}
.stat strong{font-size:22px}
.bars{display:flex;align-items:flex-end;gap:5px;height:90px;margin:10px 0 16px}
.bars i{flex:1;border-radius:4px 4px 0 0;background:var(--ink-2);opacity:.85}
.bars i.s{background:var(--sun)}
.card-note{font-size:13px;color:var(--muted);margin:8px 0 0}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}}

/* services */
.grid{display:grid;gap:20px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media (max-width:980px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr}}
@media (max-width:640px){.g4,.g2{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(242,163,58,.16);margin-bottom:14px}
.card p{margin:0;color:var(--ink-2);font-size:16px}
.tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--leaf);background:rgba(63,143,122,.12);padding:3px 9px;border-radius:999px;margin-bottom:10px}
.section-head{max-width:640px;margin-bottom:36px}
.section-head p{color:var(--ink-2)}

/* audiences */
.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.aud ul{margin:12px 0 0;padding-left:20px;color:var(--ink-2)}
.aud li{margin:6px 0}

/* steps */
.steps{counter-reset:step}
.step{position:relative;padding-left:58px}
.step::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700}

/* about */
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:start}
.avatar.photo{object-fit:cover;width:100%;max-width:360px;height:auto;box-shadow:0 20px 50px -30px rgba(20,54,61,.45)}
.avatar{aspect-ratio:1/1;border-radius:20px;background:linear-gradient(135deg,var(--ink),var(--ink-2));display:grid;place-items:center;color:#fff;font-size:64px;font-weight:800;letter-spacing:-.03em}
.creds{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.creds span{font-size:14px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
@media (max-width:820px){.about{grid-template-columns:1fr}.avatar{max-width:220px}}

/* contact */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:44px}
@media (max-width:900px){.contact{grid-template-columns:1fr}}
form{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px}
label{display:block;font-weight:600;font-size:15px;margin:14px 0 6px}
input,select,textarea{width:100%;font:inherit;font-size:16px;padding:11px 13px;border:1px solid #cfc7b8;border-radius:10px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(242,163,58,.45);border-color:var(--sun-deep)}
textarea{min-height:130px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.row2{grid-template-columns:1fr}}
.hp{position:absolute;left:-9999px}
.form-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px}
.small{font-size:14px;color:var(--muted)}
#formStatus{font-weight:600}
.contact-list{list-style:none;padding:0;margin:22px 0 0}
.contact-list li{padding:12px 0;border-top:1px solid var(--line)}
.contact-list li:first-child{border-top:0}
.contact-list span{display:block;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:700}


/* promise */
.promise{padding:0 0 20px}
.promise-box{display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center;background:var(--ink);color:#eef4f3;border-radius:22px;padding:40px}
.promise-box h2{color:#fff}
.promise-box p{color:#d3e0de;margin:0}
.promise-box .eyebrow{color:var(--sun)}
.checks{list-style:none;margin:0;padding:0}
.checks li{padding:9px 0 9px 34px;position:relative;font-weight:600}
.checks li::before{content:"";position:absolute;left:0;top:11px;width:22px;height:22px;border-radius:50%;background:var(--sun) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' fill='none' stroke='%2314363d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
@media (max-width:820px){.promise-box{grid-template-columns:1fr;padding:28px}}


.card-cta{background:var(--ink);border-color:var(--ink)}
.card-cta h3{color:#fff}
.card-cta p{color:#d3e0de}
.hero-img{display:block;width:100%;height:auto;margin:8px 0 4px}
.tabs{display:flex;gap:6px;margin-bottom:10px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px}
.tab{flex:1;border:0;background:transparent;padding:8px 12px;border-radius:999px;font-weight:600;font-size:14px;color:var(--ink-2)}
.tab.active{background:var(--ink);color:#fff}
.tab:focus-visible{outline:3px solid rgba(242,163,58,.6)}
.results{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px 28px}
.results li{padding:16px 18px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--sun);border-radius:12px;color:var(--ink-2)}
.results b{color:var(--ink)}
@media (max-width:760px){.results{grid-template-columns:1fr}}
.ai{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
@media (max-width:820px){.ai{grid-template-columns:1fr}}
.checks-light li{color:var(--ink)}
.cred-h{font-size:20px;margin:6px 0 8px}
.cred-intro{color:var(--ink-2);max-width:760px;margin:0 0 18px}
.cred-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
@media (max-width:980px){.cred-grid{grid-template-columns:1fr}}
.cred-list{margin:10px 0 0;padding-left:18px;color:var(--ink-2);font-size:16px}
.cred-list li{margin:8px 0}
.cred-list b{color:var(--ink)}
.webinar{display:grid;grid-template-columns:300px 1fr;gap:24px;align-items:center;margin-top:20px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--ink);transition:box-shadow .15s}
.webinar:hover{box-shadow:0 14px 34px -22px rgba(20,54,61,.5)}
.webinar-thumb{position:relative;display:block;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:#000}
.webinar-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.play{position:absolute;inset:0;margin:auto;width:64px;height:44px;border-radius:12px;background:rgba(20,54,61,.85)}
.play::after{content:"";position:absolute;left:26px;top:13px;border-left:16px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent}
.webinar-thumb:hover .play,.webinar-thumb:focus-visible .play{background:var(--sun-deep)}
.webinar-text{display:flex;flex-direction:column;gap:6px}
.webinar-text .tag{align-self:flex-start;margin:0}
.webinar-title{font-weight:800;font-size:19px;line-height:1.3}
.webinar-cap{color:var(--ink-2);font-size:16px}
.webinar-cta{font-weight:700;color:var(--sun-deep);text-decoration:none;align-self:flex-start}
.webinar-cta:hover{text-decoration:underline}
.webinar-thumb:focus-visible{outline:3px solid rgba(242,163,58,.6);outline-offset:3px}
.webinar.playing{grid-template-columns:1fr;gap:16px}
.webinar-player{display:block;width:100%;max-width:880px;aspect-ratio:16/9;border:0;border-radius:12px;background:#000}
@media (max-width:700px){.webinar{grid-template-columns:1fr}}
/* intake */
.contact > *{min-width:0}
.file-list li span{min-width:0}
.dropzone{margin-top:4px;border:2px dashed #cfc7b8;border-radius:14px;padding:22px;text-align:center;background:#fffdf9;cursor:pointer;transition:border-color .15s,background .15s}
.dropzone p{margin:6px 0}
.dropzone:hover,.dropzone:focus,.dropzone.drag{border-color:var(--sun-deep);background:rgba(242,163,58,.08);outline:none}
.file-list{list-style:none;margin:10px 0 0;padding:0}
.file-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;margin-top:6px;font-size:15px;background:#fff}
.file-list li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-list li.err{border-color:#d9534f;color:#a12622}
.file-list button{border:0;background:none;color:var(--muted);font-size:20px;line-height:1;padding:0 4px}
.consent{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px;margin-top:18px}
.consent input{width:auto;margin-top:4px}
.email-alt{margin-top:26px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.email-alt h3{font-size:18px;margin-bottom:6px}
.email-links{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:12px}
.btn-sm{padding:9px 16px;font-size:15px}
.link-sm{font-size:15px;font-weight:600}

/* privacy note */
.privacy{padding:52px 0}
.privacy h2{font-size:22px;margin-bottom:10px}
.privacy-list{margin:0 0 14px;padding-left:20px;max-width:820px;color:var(--ink-2);font-size:16px}
.privacy-list li{margin:8px 0}
.privacy-list b{color:var(--ink)}
.foot-links a{margin-right:14px}

/* footer */
footer{background:var(--ink);color:#d9e4e2;padding:40px 0;font-size:15px}
footer a{color:#fff}
.foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* =====================================================================
   Multi-page additions (About, Services, Case studies)
   ===================================================================== */

/* current page marker in the menu */
.nav ul a[aria-current="page"]{color:var(--ink);font-weight:700;box-shadow:0 2px 0 var(--sun)}

/* small-screen menu */
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;font-weight:600;font-size:15px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fff}
.mnav summary::-webkit-details-marker{display:none}
.mnav[open] summary{background:var(--ink);color:#fff;border-color:var(--ink)}
.mnav div{position:absolute;right:0;top:46px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px;min-width:210px;box-shadow:0 20px 50px -30px rgba(20,54,61,.6)}
.mnav a{display:block;padding:10px 12px;text-decoration:none;border-radius:8px;font-weight:500}
.mnav a:hover{background:var(--bg)}
.nav{gap:18px}
@media (max-width:960px){.nav ul{display:none}.mnav{display:block}}
@media (max-width:480px){.nav > .btn{display:none}}

/* page hero */
.page-hero{padding:56px 0 48px;background:
  radial-gradient(900px 420px at 85% -10%, rgba(242,163,58,.22), transparent 60%),
  radial-gradient(700px 380px at -10% 110%, rgba(63,143,122,.14), transparent 60%)}
.page-hero h1{font-size:clamp(32px,4.6vw,48px)}
.page-hero p.lead{font-size:20px;color:var(--ink-2);max-width:62ch;margin:0}
.crumbs{font-size:14px;color:var(--muted);margin:0 0 18px}
.crumbs a{color:var(--muted)}
.jump{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0;padding:0;list-style:none}
.jump a{display:block;text-decoration:none;font-size:15px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px}
.jump a:hover{border-color:var(--ink)}
.hero-about{display:grid;grid-template-columns:1.2fr .8fr;gap:44px;align-items:center}
.hero-about img{justify-self:end}
@media (max-width:820px){.hero-about{grid-template-columns:1fr}.hero-about img{justify-self:start;max-width:240px}}

section.tight{padding:64px 0}
.prose{max-width:720px}
.prose p{color:var(--ink-2)}
.two-col{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:start}
@media (max-width:820px){.two-col{grid-template-columns:1fr;gap:10px}}

/* drafting aids: removed at go-live */
.draft-ribbon{background:#1b1b1b;color:#fff;font-size:14px;text-align:center;padding:8px 14px}
.draft-ribbon b{color:var(--sun)}
.todo{border:2px dashed var(--sun-deep);background:rgba(242,163,58,.09);border-radius:12px;padding:14px 16px;margin:14px 0;color:var(--ink-2);font-size:15.5px}
.todo::before{content:"PK to add";display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sun-deep);margin-bottom:4px}
.todo.check::before{content:"Before publishing"}
.todo.decide::before{content:"PK to decide"}
.todo ul{margin:6px 0 0;padding-left:20px}
.todo p{margin:0}
.starter{border-left:3px solid var(--leaf);padding-left:14px}
.starter::before{content:"Starter copy, edit freely";display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf);margin-bottom:4px}

/* timeline (About) */
.timeline{list-style:none;margin:0;padding:0;position:relative;max-width:760px}
.timeline::before{content:"";position:absolute;left:10px;top:8px;bottom:8px;width:2px;background:var(--line)}
.timeline > li{position:relative;padding:0 0 30px 46px}
.timeline > li:last-child{padding-bottom:0}
.timeline > li::before{content:"";position:absolute;left:2px;top:6px;width:18px;height:18px;border-radius:50%;background:var(--sun)}
.timeline .when{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf);font-weight:700;margin:0 0 2px}
.timeline h3{margin-bottom:6px}
.timeline p{margin:0 0 8px;color:var(--ink-2)}

.quals{list-style:none;padding-left:0;margin:0 0 6px}
.quals li{padding:12px 0;border-top:1px solid var(--line);margin:0}
.quals li:first-child{border-top:0;padding-top:0}

/* services in detail */
.svc{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;padding:36px 0;border-top:1px solid var(--line)}
.svc:first-of-type{border-top:0;padding-top:0}
.svc > div > p{color:var(--ink-2)}
.svc-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.svc-cols h4{margin:0 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.svc-cols ul{margin:0;padding-left:20px;color:var(--ink-2);font-size:16px}
.svc-cols li{margin:6px 0}
.svc > *, .svc-cols > *{min-width:0}
@media (max-width:860px){.svc{grid-template-columns:1fr;gap:14px}}
@media (max-width:560px){.svc-cols{grid-template-columns:1fr}}
.note{font-size:15px;color:var(--muted);border-left:3px solid var(--line);padding-left:12px;margin:16px 0 0}

/* engagement flow */
.flow{list-style:none;margin:0;padding:0;counter-reset:flow;position:relative;max-width:820px}
.flow::before{content:"";position:absolute;left:19px;top:20px;bottom:20px;width:2px;background:var(--line)}
.flow > li{position:relative;padding:0 0 30px 64px;counter-increment:flow}
.flow > li:last-child{padding-bottom:0}
.flow > li::before{content:counter(flow);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700}
.flow h3{margin-bottom:6px;padding-top:6px}
.flow p{margin:0 0 8px;color:var(--ink-2)}
.who{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;padding:0;list-style:none}
.who li{font-size:14px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.who b{color:var(--leaf)}

/* ways to engage */
.way{display:flex;flex-direction:column}
.way .tag,.cs-card .tag{align-self:flex-start}
.way .best{margin-top:auto;padding-top:14px;font-size:15px;color:var(--muted)}
.way .best b{color:var(--ink)}

/* questions */
.faq{max-width:820px}
.faq details{border:1px solid var(--line);border-radius:12px;padding:14px 18px;background:#fff;margin-top:10px}
.faq summary{font-weight:600;cursor:pointer}
.faq details p{color:var(--ink-2);margin:10px 0 0}

/* case studies */
.cs-card{display:flex;flex-direction:column}
.cs-card .more{margin-top:auto;padding-top:16px;font-weight:600}
.cs{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:34px;margin-top:28px;scroll-margin-top:90px}
.cs h2{font-size:clamp(22px,2.8vw,30px)}
.cs-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px;list-style:none;padding:0}
.cs-meta li{font-size:14px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.cs-meta b{color:var(--muted);font-weight:600}
.cs-body{display:grid;grid-template-columns:1.35fr .65fr;gap:36px;align-items:start}
.cs-body > *{min-width:0}
.cs-body h3{font-size:18px;margin:22px 0 6px}
.cs-body h3:first-child{margin-top:0}
@media (max-width:900px){.cs-body{grid-template-columns:1fr}.cs{padding:24px}}
.cs-chart{aspect-ratio:4/3;border:2px dashed #cfc7b8;border-radius:14px;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:15px;padding:16px;background:#fffdf9}
.cs-body p{color:var(--ink-2)}
.cs-figs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 30px}
.cs-figs > *{min-width:0}
@media (max-width:760px){.cs-figs{grid-template-columns:1fr}}
.cs-figure{margin:0;border:1px solid var(--line);border-radius:14px;padding:16px 16px 10px;background:#fff}
.cs-figure img{display:block;width:100%;height:auto}
.cs-figure figcaption{font-size:14px;color:var(--muted);margin-bottom:8px}
.cs-figure figcaption b{color:var(--ink);font-size:16px}
.kpis{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.kpis li{border-left:4px solid var(--sun);padding:12px 16px;background:var(--bg);border-radius:10px;color:var(--ink-2);font-size:15.5px}
.kpis b{display:block;color:var(--ink);font-size:17px}
.cs-quote{margin:24px 0 0;padding:18px 22px;border-radius:14px;background:var(--bg);border:1px solid var(--line);font-size:18px;color:var(--ink-2)}
.cs-quote cite{display:block;font-size:14px;font-style:normal;color:var(--muted);margin-top:8px}
.cs-attrib{font-size:14px;color:var(--muted);border-top:1px solid var(--line);margin:24px 0 0;padding-top:14px}

/* call to action band */
.cta-band{background:var(--ink);color:#eef4f3;border-radius:22px;padding:36px 40px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cta-band h2{color:#fff;margin-bottom:6px}
.cta-band p{color:#d3e0de;margin:0;max-width:52ch}
.cta-band .ctas{display:flex;gap:12px;flex-wrap:wrap}
.cta-band .btn-ghost{border-color:#fff;color:#fff}
@media (max-width:640px){.cta-band{padding:28px}}

/* teaser links on the home page */
.teaser{margin:26px 0 0}
.teaser a{font-weight:600}
.teaser a::after{content:" \2192"}

/* footer links (matches the home page) */
.foot-links a{margin-right:14px}


/* =====================================================================
   Site navigation: tabs on wide screens, hamburger on narrow ones
   ===================================================================== */
.nav{gap:16px}
.nav .tabs-nav{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav .tabs-nav a{display:block;padding:8px 13px;border-radius:999px;text-decoration:none;font-weight:600;font-size:15.5px;color:var(--ink-2);white-space:nowrap}
.nav .tabs-nav a:hover{background:rgba(20,54,61,.07);color:var(--ink)}
.nav .tabs-nav a[aria-current="page"]{background:var(--ink);color:#fff;box-shadow:none}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;font-weight:600;font-size:15px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;display:flex;align-items:center;gap:8px}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary .bars{display:inline-block;width:18px;height:2px;background:currentColor;position:relative}
.mnav summary .bars::before,.mnav summary .bars::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor}
.mnav summary .bars::before{top:-6px}.mnav summary .bars::after{top:6px}
.mnav[open] summary{background:var(--ink);color:#fff;border-color:var(--ink)}
.mnav .mnav-panel{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px;min-width:230px;box-shadow:0 20px 50px -30px rgba(20,54,61,.6);z-index:20}
.mnav .mnav-panel a{display:block;padding:11px 12px;text-decoration:none;border-radius:8px;font-weight:600;color:var(--ink-2)}
.mnav .mnav-panel a:hover{background:var(--bg)}
.mnav .mnav-panel a[aria-current="page"]{background:var(--ink);color:#fff}
@media (max-width:1100px){.nav .tabs-nav{display:none}.mnav{display:block}}
@media (max-width:480px){.nav > .btn{display:none}}

/* preview ribbon: removed at go-live */
.draft-ribbon{background:#1b1b1b;color:#fff;font-size:14px;text-align:center;padding:8px 14px}
.draft-ribbon b{color:var(--sun)}

/* home: VEN Management band, teasers */
.ven-band{padding:28px 0 0}
.ven-band-box{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-left:6px solid var(--sun);border-radius:18px;padding:22px 26px}
.ven-band-box h2{font-size:22px;margin:4px 0 6px}
.ven-band-box p{margin:0;color:var(--ink-2)}
.ven-band-box .eyebrow{margin:0}
.teaser{margin:26px 0 0}
.teaser a{font-weight:600}
.teaser a::after{content:" \2192"}
.cs-card{display:flex;flex-direction:column}
.cs-card .tag{align-self:flex-start}
.cs-card .more{margin-top:auto;padding-top:16px;font-weight:600}
.about-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px}
.about-links a{font-weight:600}
.about-links a::after{content:" \2192"}

/* VEN Management page */
.ven-hero{display:grid;grid-template-columns:1.35fr .65fr;gap:40px;align-items:center}
@media (max-width:900px){.ven-hero{grid-template-columns:1fr}}
.price-box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;text-align:center;box-shadow:0 20px 50px -30px rgba(20,54,61,.45)}
.price-amount{font-size:52px;font-weight:800;letter-spacing:-.02em;margin:0;line-height:1}
.price-gst{margin:4px 0 12px;color:var(--muted);font-weight:600}
.price-what{margin:0 0 6px;font-weight:700}
.price-box .btn{margin-top:14px}
.ven-cards .card h3{font-size:18px}
.ven-disclaimer{max-width:820px}

/* Letter of Authority form */
.loa{max-width:880px}
.loa-h{font-size:18px;margin:30px 0 6px;padding-top:18px;border-top:1px solid var(--line)}
.loa-h:first-child{margin-top:0;padding-top:0;border-top:0}
.req{color:#a12622}
.site-row{display:grid;grid-template-columns:1.4fr 1fr auto;gap:12px;align-items:end}
.site-row label{margin-top:10px}
.row-del{border:1px solid var(--line);background:#fff;border-radius:10px;width:44px;height:44px;font-size:20px;color:var(--muted)}
.seg-field{border:0;padding:0;margin:18px 0 0}
.seg-field legend{font-weight:600;font-size:15px;margin-bottom:6px;padding:0}
label.inline{display:inline-flex;align-items:center;gap:8px;font-weight:500;margin:4px 20px 4px 0}
label.inline input{width:auto}
.seg-field textarea{margin-top:8px}
.loa-text{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px;font-size:15.5px;color:var(--ink-2);max-height:360px;overflow:auto}
.loa-text ol{padding-left:22px}
.loa-text li{margin:6px 0}
.sig-methods{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 12px}
.sig-opt{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;margin:0;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;cursor:pointer}
.sig-opt input{width:auto;margin:0}
.sig-opt:has(input:checked){border-color:var(--ink);background:var(--ink);color:#fff}
.sigpad-wrap{border:2px dashed #cfc7b8;border-radius:14px;background:#fff;padding:6px}
#sigpad{display:block;width:100%;height:auto;aspect-ratio:640/180;touch-action:none;cursor:crosshair;border-radius:10px}
.sig-actions{margin:6px 0 0}
.link-btn{border:0;background:none;padding:0;color:var(--ink);text-decoration:underline;font-weight:600}
.sig-preview{display:block;max-width:320px;max-height:120px;margin-top:10px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:6px}
.sig-line{margin-top:14px}
.sig-label{display:block;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.sig-value{display:block;font-weight:600;padding:6px 0;border-bottom:1px solid var(--ink-2)}
.loa .form-foot{gap:12px}

/* print: the authority on A4 */
@page{size:A4;margin:16mm}
@media print{
  header,footer,.draft-ribbon,.no-print,.page-hero,#included,#how-ven,#ven-faq,.todo,.starter::before,.section-head p{display:none!important}
  body{background:#fff;font-size:11pt}
  section{padding:0!important}
  .alt{background:#fff;border:0}
  .loa{max-width:none}
  .loa-text{max-height:none;overflow:visible;border:0;padding:0}
  input,textarea,select{border:0;border-bottom:1px solid #999;border-radius:0;padding:4px 0}
  textarea{min-height:0}
  .sigpad-wrap{border:1px solid #999}
  .loa-h{break-after:avoid}
}

/* VEN Management: QuantumNRG partnership tile (left of the hero text) */
.ven-hero.ven-hero-3{grid-template-columns:1.35fr auto .65fr;gap:36px}
.partner-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:176px;padding:46px 16px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 20px 50px -30px rgba(20,54,61,.45)}
.partner-label{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center;line-height:1.4}
.partner-logo{display:block;line-height:0}
.partner-logo img{width:124px;height:auto}
.price-partner{margin:14px 0 0;color:var(--muted)}
@media (max-width:1100px){.ven-hero.ven-hero-3{grid-template-columns:1fr auto;}.ven-hero.ven-hero-3 .price-box{grid-column:1 / -1}}
@media (max-width:640px){.ven-hero.ven-hero-3{grid-template-columns:1fr}.partner-tile{flex-direction:row;justify-self:start;border-radius:999px;padding:10px 22px;gap:16px;min-width:0}.partner-label{text-align:left}.partner-label br{display:none}.partner-tile{width:auto;padding:10px 22px}.partner-logo img{width:84px}}
@media print{.partner-tile{box-shadow:none}}

/* VEN Management v3: fee display, optional fields, Matched Rate note */
.price-from{font-size:20px;font-weight:700;letter-spacing:0;vertical-align:middle;margin-right:2px}
.price-sub{margin:-6px 0 12px;font-size:14.5px;color:var(--ink-2)}
.fee-line{margin:4px 0 0;padding:10px 14px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--sun);border-radius:10px;font-size:15px;color:var(--ink-2)}
.opt{color:#d9534f;font-weight:700}
.rate-note{margin:10px 0 4px;padding:10px 14px;background:#fdf1f0;border-radius:10px;font-size:14.5px;color:var(--ink-2)}
@media (max-width:640px){.partner-tile{justify-self:start}}

/* Services and Case studies go-live (20261109) */
.step-note{margin:6px 0 0;font-weight:600;color:var(--ink)}
.cs-list{margin-top:8px}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.reviews-grid:not(:has(.review-card)){display:none}
.review-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.review-card .stars{margin:0 0 8px;color:var(--sun);letter-spacing:2px;font-size:18px}
.review-card blockquote{margin:0 0 12px;font-size:16px;color:var(--ink-2)}
.review-card figcaption{font-size:14px;color:var(--muted)}
.reviews-empty{color:var(--ink-2);margin:0 0 12px}
