
:root{
  --paper:#FFFFFF;
  --paper-alt:#F6F6F1;
  --ink:#15232A;
  --ink-soft:#5C6B67;
  --navy:#10222E;
  --green:#2F6A4C;
  --green-deep:#204F38;
  --green-bright:#4C8F6C;
  --green-tint:#E9F1E8;
  --amber:#A9782E;
  --amber-tint:#F4ECDC;
  --brick:#A34E3B;
  --brick-tint:#F3E4DF;
  --line:rgba(16,34,46,0.13);
  --shadow:0 1px 2px rgba(16,34,46,0.05), 0 10px 28px rgba(16,34,46,0.06);
  color-scheme:light;
}

:root[data-theme="dark"]{
  --paper:#131C19;
  --paper-alt:#1A2420;
  --ink:#ECEEE4;
  --ink-soft:#A6B7AF;
  --navy:#ECEEE4;
  --green:#6FA287;
  --green-deep:#8FC2A3;
  --green-bright:#6FA287;
  --green-tint:rgba(111,162,135,0.14);
  --amber:#D2A85C;
  --amber-tint:rgba(210,168,92,0.14);
  --brick:#CC8770;
  --brick-tint:rgba(204,135,112,0.14);
  --line:rgba(236,238,228,0.14);
  --shadow:0 1px 2px rgba(0,0,0,0.3), 0 10px 28px rgba(0,0,0,0.35);
  color-scheme:dark;
}

:root{--lead-size:clamp(16px,1.3vw,17px);}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Almarai', Arial, sans-serif;
}
img{max-width:100%;}
h1,h2,h3{
  font-family:'Almarai', Arial, sans-serif;
  font-weight:800;
  line-height:1.1;
  letter-spacing:-0.01em;
  text-wrap:balance;
  margin:0;
  color:var(--ink);
}
p{margin:0;}
a{color:inherit;}
button{font-family:inherit;}
.eyebrow{
  font-family:'Almarai', Arial, sans-serif;
  font-size:12px;
  font-weight:400;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--green-deep);
}
.eyebrow-pill{
  display:inline-flex;
  align-items:center;
  font-family:'Almarai', Arial, sans-serif;
  font-size:11.5px;
  font-weight:400;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px 14px;
}
.wrap{
  max-width:1080px;
  margin-inline:auto;
  padding-inline:24px;
}
@media (max-width:600px){ .wrap{padding-inline:18px;} }

/* ---------- nav ---------- */
.topbar{
  position:sticky;
  top:env(safe-area-inset-top,0px);
  z-index:40;
  background:color-mix(in srgb, var(--paper) 90%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  max-width:1080px;
  margin-inline:auto;
  padding-inline:24px;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:var(--ink);
  cursor:pointer;
  background:none;
  border:none;
  padding:0;
}
.brand-name{
  font-family:'Almarai', Arial, sans-serif;
  font-weight:700;
  font-size:19px;
  letter-spacing:-0.01em;
}
.navlinks{
  display:flex;
  align-items:center;
  gap:28px;
}
.navlinks button{
  background:none;
  border:none;
  cursor:pointer;
  font-size:14px;
  font-weight:400;
  color:var(--ink-soft);
  padding:6px 0;
  position:relative;
}
.navlinks button.active{color:var(--ink);}
.navlinks button.active::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-2px;
  height:2px;
  background:var(--green);
  border-radius:2px;
}
.nav-cta{
  background:var(--green);
  color:#fff;
  border:none;
  border-radius:7px;
  padding:9px 16px;
  font-size:13.5px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.nav-cta:hover{background:var(--green-deep);}
.navlinks-mobile{display:none;}
@media (max-width:760px){
  .navlinks{display:none;}
  .navlinks-mobile{display:block;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:8px;
  padding:12px 20px;
  font-size:14.5px;
  font-weight:700;
  cursor:pointer;
  border:1px solid transparent;
  text-decoration:none;
}
.btn-primary{background:var(--green); color:#fff; border-color:var(--green);}
.btn-primary:hover{background:var(--green-deep); border-color:var(--green-deep);}
.btn-outline{background:transparent; color:var(--ink); border-color:var(--line);}
.btn-outline:hover{background:var(--paper-alt);}
.btn:focus-visible{outline:2px solid var(--green-bright); outline-offset:2px;}

/* ---------- hero ---------- */
.hero{
  background:var(--paper);
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero-inner{
  position:relative;
  z-index:2;
  padding-block:56px 88px;
  display:flex;
  flex-direction:column;
  gap:20px;
  max-width:720px;
}
.hero h1{font-size:clamp(28px,4.6vw,44px);}
.hero .sub{
  font-family:'Almarai', Arial, sans-serif;
  font-size:clamp(17px,2.2vw,21px);
  font-weight:400;
  
  color:var(--green-deep);
}
.hero .body{
  font-size:15.5px;
  line-height:1.65;
  color:var(--ink-soft);
  max-width:58ch;
}
.hero-ctas{display:flex; gap:12px; flex-wrap:wrap; margin-top:6px;}
.hero-fine{
  font-family:'Almarai', Arial, sans-serif;
  font-size:11.5px;
  color:var(--ink-soft);
  letter-spacing:0.02em;
  max-width:54ch;
}
.hero-svg{
  position:absolute;
  inset:0;
  z-index:1;
  opacity:0.9;
}

/* ---------- floating stat card (overlaps hero) ---------- */
.float-wrap{
  margin-top:-52px;
  position:relative;
  z-index:3;
}
.float-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow);
  display:grid;
  grid-template-columns:repeat(3,1fr);
}
.float-item{
  padding:22px 24px;
  border-left:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.float-item:first-child{border-left:none;}
.float-num{
  font-family:'Almarai', Arial, sans-serif;
  font-size:28px;
  font-weight:700;
  color:var(--green-deep);
}
.float-label{font-size:13px; color:var(--ink-soft); line-height:1.4;}
@media (max-width:700px){
  .float-card{grid-template-columns:1fr;}
  .float-item{border-left:none; border-top:1px solid var(--line);}
  .float-item:first-child{border-top:none;}
}

/* ---------- sections ---------- */
section.band{padding-block:64px;}
.band.alt{background:var(--paper-alt);}
.section-head{
  display:flex;
  flex-direction:column;
  gap:12px;
  max-width:640px;
  margin-bottom:36px;
}
.section-head h2{font-size:clamp(22px,3vw,30px);}
.section-head .lede{color:var(--ink-soft); font-size:var(--lead-size); line-height:1.65;}

/* ---------- SCaLE cards ---------- */
.scale-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
@media (max-width:700px){ .scale-grid{grid-template-columns:1fr;} }
.scale-card{
  background:var(--green-tint);
  border:1px solid var(--line);
  border-radius:12px;
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.scale-card .num{
  font-family:'Almarai', Arial, sans-serif;
  font-size:12px;
  font-weight:400;
  letter-spacing:0.1em;
  color:var(--green-deep);
}
.scale-card h3{font-size:18px; font-weight:700;}
.scale-card p{font-size:14px; line-height:1.55; color:var(--ink-soft);}
.scale-card ul{
  margin:6px 0 0;
  padding-left:16px;
  font-size:13.5px;
  color:var(--ink-soft);
  line-height:1.6;
  display:flex;
  flex-direction:column;
  gap:4px;
}

/* ---------- clearance / certifications card ---------- */
.cert-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:14px;
  padding:8px 28px;
}
.cert-item{
  display:grid;
  grid-template-columns:44px 1fr;
  gap:16px;
  align-items:flex-start;
  padding-block:20px;
  border-top:1px solid var(--line);
}
.cert-item:first-child{border-top:none;}
.cert-icon{
  width:40px; height:40px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  flex:none;
}
.cert-item h3{font-size:16px; font-weight:700; margin-bottom:3px;}
.cert-item p{font-size:14px; color:var(--ink-soft); line-height:1.55;}
.tag-cleared{background:var(--green-tint); color:var(--green-deep);}
.tag-conditions{background:var(--green-tint); color:var(--green);}
.tag-hold{background:var(--amber-tint); color:var(--amber);}
.tag-grounded{background:var(--brick-tint); color:var(--brick);}

/* ---------- stat tiles ---------- */
.stat-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
@media (max-width:700px){ .stat-grid{grid-template-columns:1fr;} }
.stat-tile{
  border:1px solid var(--line);
  border-radius:12px;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:6px;
  background:var(--paper);
}
.stat-tile h3{font-size:16px; font-weight:700;}
.stat-tile p{font-size:13.5px; color:var(--ink-soft); line-height:1.55;}

/* ---------- rules list ---------- */
.rules-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.rule-item{
  display:grid;
  grid-template-columns:44px 1fr;
  gap:16px;
  padding-block:20px;
  border-top:1px solid var(--line);
}
.rule-item:last-child{border-bottom:1px solid var(--line);}
.rule-num{
  font-family:'Almarai', Arial, sans-serif;
  font-weight:700;
  font-size:20px;
  color:var(--green-deep);
}
.rule-item h3{font-size:15.5px; font-weight:700; margin-bottom:4px;}
.rule-item p{font-size:14px; color:var(--ink-soft); line-height:1.6;}

/* ---------- forms ---------- */
.card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:28px;
  background:var(--paper);
}
.form-grid{display:flex; flex-direction:column; gap:14px; margin-top:18px;}
.field{display:flex; flex-direction:column; gap:6px;}
.field label{font-size:12.5px; font-weight:700; color:var(--ink-soft);}
.field input, .field textarea, .field select{
  font-family:inherit;
  font-size:14.5px;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--paper-alt);
  color:var(--ink);
}
.field textarea{resize:vertical; min-height:80px;}
.field input:focus, .field textarea:focus, .field select:focus{
  outline:2px solid var(--green-bright);
  outline-offset:1px;
}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:560px){ .form-row{grid-template-columns:1fr;} }
.confirm{
  display:none;
  flex-direction:column;
  gap:8px;
  align-items:flex-start;
  padding-block:8px;
}
.confirm.show{display:flex;}
.confirm .tick{
  width:34px; height:34px; border-radius:50%;
  background:var(--green-tint);
  display:flex; align-items:center; justify-content:center;
  color:var(--green-deep);
}
.form-grid.hide, .dl-form.hide{display:none;}

.download-row{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}
.doc-icon{
  width:46px; height:56px; flex:none;
  border-radius:4px;
  background:var(--green-tint);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.dl-form{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
.dl-form input{
  font-family:inherit; font-size:14px;
  padding:10px 12px; border-radius:8px;
  border:1px solid var(--line);
  background:var(--paper-alt); color:var(--ink);
  flex:1; min-width:180px;
}

.copy-row{
  display:flex; align-items:center; gap:8px;
  font-family:'Almarai', Arial, sans-serif;
  font-size:13.5px;
}
.copy-btn{
  border:1px solid var(--line);
  background:var(--paper-alt);
  border-radius:6px;
  padding:4px 9px;
  font-size:11.5px;
  cursor:pointer;
  color:var(--ink-soft);
}

/* ---------- footer ---------- */
footer{
  background:var(--paper-alt);
  color:var(--ink-soft);
  border-top:1px solid var(--line);
  padding-block:44px calc(28px + env(safe-area-inset-bottom,0px));
}
.footer-top{
  display:flex;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
  padding-bottom:28px;
  border-bottom:1px solid var(--line);
}
.footer-brand{display:flex; flex-direction:column; gap:8px; max-width:260px;}
.footer-logo img{height:46px; width:auto; display:block;}
.footer-tagline{
  font-family:'Almarai', Arial, sans-serif;
  font-size:11.5px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--green-deep);
}
.footer-cols{display:flex; gap:56px; flex-wrap:wrap;}
.footer-col{display:flex; flex-direction:column; gap:10px;}
.footer-col-title{font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); font-family:'Almarai', Arial, sans-serif;}
.footer-col a, .footer-col button{
  background:none; border:none; text-align:left; cursor:pointer;
  color:var(--ink); font-size:14px; padding:0; text-decoration:none;
}
.footer-bottom{
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  font-size:12.5px;
}

/* ---------- step list (method page) ---------- */
.step-card{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}
.step-item{
  display:grid;
  grid-template-columns:96px 1fr 188px;
  gap:18px;
  align-items:flex-start;
  padding:22px 24px;
  border-top:1px solid var(--line);
}
.step-item:first-child{border-top:none;}
.step-num{
  font-family:'Almarai', Arial, sans-serif;
  font-weight:700;
  font-size:24px;
  color:var(--green-deep);
  line-height:1;
}
.step-stage{
  font-family:'Almarai', Arial, sans-serif;
  font-size:10.5px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-top:4px;
}
.step-item h3{font-size:16.5px; font-weight:700; margin-bottom:5px;}
.step-assumption{font-size:13.5px; color:var(--ink-soft); line-height:1.55; }
.step-output{font-size:13px; color:var(--green-deep); margin-top:7px; font-weight:400;}
.step-price{
  font-size:13px;
  color:var(--ink-soft);
  text-align:right;
  padding-top:2px;
}
.step-price strong{display:block; color:var(--ink); font-size:14px; font-weight:700; margin-bottom:2px;}
@media (max-width:700px){
  .step-item{grid-template-columns:1fr; gap:8px;}
  .step-price{text-align:left; padding-top:6px;}
}

/* ---------- pricing tiers ---------- */
.tier-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
@media (max-width:820px){ .tier-grid{grid-template-columns:1fr;} }
.tier-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:26px 24px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:var(--paper);
}
.tier-card.featured{
  border-color:var(--green);
  box-shadow:var(--shadow);
  position:relative;
}
.tier-flag{
  position:absolute; top:-11px; left:24px;
  background:var(--green); color:#fff;
  font-family:'Almarai', Arial, sans-serif;
  font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase;
  padding:4px 10px; border-radius:999px;
}
.tier-stage-tag{font-family:'Almarai', Arial, sans-serif; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft);}
.tier-name{font-family:'Almarai', Arial, sans-serif; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--green-deep); font-weight:400;}
.tier-price{font-family:'Almarai', Arial, sans-serif; font-size:26px; font-weight:700; color:var(--ink);}
.tier-card p{font-size:14px; color:var(--ink-soft); line-height:1.55;}
.tier-card ul{margin:0; padding-left:16px; font-size:13.5px; color:var(--ink-soft); line-height:1.7; display:flex; flex-direction:column; gap:2px;}
.tier-output{
  margin-top:auto;
  min-height:50px;
  line-height:1.45;
  font-size:12.5px;
  color:var(--ink-soft);
  border-top:1px solid var(--line);
  padding-top:12px;
}
.tier-output strong{color:var(--ink); font-weight:700;}

/* ---------- CTA banner (bottom of pages) ---------- */
.cta-banner{
  border-radius:14px;
  background:var(--green-tint);
  border:1px solid var(--line);
  padding:30px 28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.cta-banner h3{font-size:19px;}
.cta-banner p{color:var(--ink-soft); font-size:14px; margin-top:4px;}




/* ---------- live-site additions ---------- */
a.btn{text-decoration:none;}
a.nav-cta{text-decoration:none; display:inline-block;}
.navlinks a{font-size:14px; font-weight:400; color:var(--ink-soft); padding:6px 0; position:relative; text-decoration:none;}
.navlinks a.active{color:var(--ink);}
.navlinks a.active::after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--green); border-radius:2px;}
.navlinks a:hover{color:var(--ink);}
.navlinks a.nav-cta{color:#fff; padding:9px 16px;}
.navlinks a.nav-cta::after{display:none;}
.menu{display:none; position:relative;}
.menu summary{list-style:none; cursor:pointer; border:1px solid var(--line); border-radius:7px; padding:8px 12px; font-size:13.5px; font-weight:700; color:var(--ink);}
.menu summary::-webkit-details-marker{display:none;}
.menu-panel{position:absolute; right:0; top:calc(100% + 8px); background:var(--paper); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); padding:10px; display:flex; flex-direction:column; min-width:220px;}
.menu-panel a{padding:10px 12px; border-radius:8px; color:var(--ink); text-decoration:none; font-size:15px;}
.menu-panel a:hover{background:var(--paper-alt);}
.menu-panel a.nav-cta{color:#fff; text-align:center; margin-top:6px;}
@media (max-width:760px){ .menu{display:block;} }
.footer-col a{color:var(--ink); font-size:14px; text-decoration:none;}
.footer-col a:hover{text-decoration:underline;}
.privacy-line{font-size:12.5px; color:var(--ink-soft); margin-top:10px;}
.privacy-line a{color:var(--ink-soft);}
.hidden-field{position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;}
.prose{max-width:720px; display:flex; flex-direction:column; gap:14px; font-size:15.5px; line-height:1.7; color:var(--ink-soft);}
.prose h2{font-size:22px; margin-top:14px;}
.eyebrow-pill{align-self:flex-start;}
.hero-inner{max-width:none;}
.hero-inner > *{max-width:720px;}

/* ---------- Firin-style home ---------- */
.brand-logo{height:46px; width:auto; display:block;}
@media (max-width:600px){ .brand-logo{height:38px;} }
.topbar-inner{height:76px;}
.fhero{position:relative; overflow:hidden; background:#EEF0EE; min-height:620px; display:flex; align-items:flex-start;}
.fhero-bg{position:absolute; inset:0; background-image:linear-gradient(90deg, rgba(248,248,245,0.55) 0%, rgba(248,248,245,0.25) 35%, rgba(248,248,245,0) 55%), url('images/hero.jpg'); background-size:cover; background-position:center;}
.fhero-inner{width:100%; position:relative; z-index:2; padding-block:88px 116px; display:flex; flex-direction:column; gap:36px;}
.fhero h1{font-weight:800; font-size:clamp(32px,4.2vw,54px); line-height:1.1; letter-spacing:-0.01em; color:#15232A; max-width:none;}
.fhero-sub{font-size:var(--lead-size); line-height:1.65; color:#2A3A40; max-width:40ch;}
.fhero-head{display:flex; flex-direction:column; gap:22px;}
.fhero-tag{font-weight:300; font-size:clamp(20px,2.2vw,28px); line-height:1.35; letter-spacing:-0.005em; color:var(--green-deep); max-width:none;}
.btn-ghost{background:rgba(255,255,255,0.7); color:#15232A; border-color:rgba(21,35,42,0.25);}
.btn-ghost:hover{background:#fff;}
.fcards-band{background:var(--paper-alt); padding-bottom:40px;}
.fcards{position:relative; z-index:3; margin-top:-52px;}
.fstrip{display:grid; grid-template-columns:repeat(3,1fr); background:var(--paper); border:1.5px solid var(--green-deep); border-radius:16px; box-shadow:var(--shadow); max-width:1000px; margin-inline:auto;}
.fcard{display:flex; align-items:center; gap:14px; padding:18px 22px; color:var(--green-deep);}
.fcard + .fcard{border-left:1px solid var(--line);}
.fcard svg{width:34px; height:34px; flex:none;}
.fcard p{color:var(--ink); font-size:14.5px; line-height:1.4;}
.split-band{background:#EDEEEC;}
.split{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center;}
.split-copy{display:flex; flex-direction:column; gap:18px;}
h2.big{font-weight:800; font-size:clamp(22px,3vw,30px); line-height:1.1; letter-spacing:-0.01em;}
.split .lede{color:var(--ink-soft); font-size:var(--lead-size); line-height:1.65; max-width:46ch;}
.text-link{font-weight:700; color:var(--green-deep); text-decoration:none; font-size:15px;}
.text-link:hover{text-decoration:underline;}
.v-card{background:var(--paper); border:1.5px solid var(--green-deep); border-radius:18px; padding:26px 28px; box-shadow:var(--shadow);}
.v-title{font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:6px;}
.v-item{display:grid; grid-template-columns:48px 1fr; gap:16px; align-items:center; padding-block:16px; border-top:1px solid var(--line);}
.v-item:first-of-type{border-top:none;}
.v-icon{width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;}
.v-item h3{font-size:18px; font-weight:700; color:var(--green-deep);}
.v-item p{font-size:14px; color:var(--ink-soft);}
@media (max-width:860px){
  .fcards{margin-top:-36px;}
  .fstrip{grid-template-columns:1fr;}
  .fcard{padding:12px 16px; gap:12px;}
  .fcard + .fcard{border-left:none; border-top:1px solid var(--line);}
  .fcard svg{width:26px; height:26px;}
  .fcard p{font-size:14px;}
  .split{grid-template-columns:1fr; gap:32px;}
  .fhero{min-height:0;}
  .fhero-bg{background-image:linear-gradient(180deg, rgba(248,248,245,0.95) 0%, rgba(248,248,245,0.85) 45%, rgba(248,248,245,0.2) 100%), url('images/hero.jpg'); background-position:60% center;}
  .fhero-inner{padding-block:44px 76px; gap:28px;}
  .fhero-head{gap:16px;}
  .fhero h1 br{display:none;}
}

/* ---------- Method page split ---------- */
.method-split{padding-block:56px 72px;}
.method-split .wrap{max-width:1240px;}
.ms-grid{display:grid; grid-template-columns:0.95fr 1.05fr; gap:56px; align-items:start;}
.ms-left{display:flex; flex-direction:column; gap:18px;}
.method-top{border-bottom:1px solid var(--line);}
.mt-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; padding-block:52px 56px;}
.ms-left h1{font-weight:400; font-size:clamp(34px,4.4vw,56px); letter-spacing:-0.02em; margin:4px 0 6px;}
.ms-left p{font-size:16px; line-height:1.65; color:var(--ink); max-width:52ch;}
.ms-left .ms-strong{font-weight:700;}
.ms-img{width:100%; height:auto; border-radius:10px;}
.ms-steps{display:grid; grid-template-columns:1fr 1fr; gap:44px 36px; padding-top:18px;}
.ms-step h2{font-weight:400; font-size:clamp(24px,2.4vw,32px); letter-spacing:-0.01em;}
.ms-step h2 span{margin-right:6px;}
.ms-step h3{font-weight:400; font-size:clamp(19px,1.8vw,23px); color:var(--green); margin:14px 0 16px;}
.ms-step p{font-size:15.5px; line-height:1.6; color:var(--ink);}
.ms-step .ms-out{font-weight:700; margin-top:16px;}
@media (max-width:960px){ .mt-grid{grid-template-columns:1fr; gap:32px; padding-block:40px 44px;} }
@media (max-width:560px){ .ms-steps{grid-template-columns:1fr; gap:32px;} }
.about-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:28px;}
@media (max-width:760px){ .about-grid{grid-template-columns:1fr;} }

/* Page intro (method) */
.page-tag{font-weight:300; font-size:clamp(19px,2vw,24px); line-height:1.4; color:var(--green-deep); margin-top:18px; max-width:40ch;}
.page-body{display:flex; flex-direction:column; gap:12px; margin-top:16px; max-width:62ch;}
.page-body p{font-size:var(--lead-size); line-height:1.65; color:var(--ink-soft); max-width:none;}
/* Method steps: output in the right-hand column */
.step-card--method .step-item{grid-template-columns:96px 1fr 260px;}
.step-out{font-size:14px; line-height:1.45; color:var(--green-deep); font-weight:700;}
.step-out span{display:block; font-family:'Almarai', Arial, sans-serif; font-size:10.5px; font-weight:400; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:4px;}
@media (max-width:700px){ .step-card--method .step-item{grid-template-columns:64px 1fr;} .step-card--method .step-out{grid-column:2;} }
/* About intro with photo */
.about-intro{display:grid; grid-template-columns:240px 1fr; gap:40px; align-items:start;}
.about-photo{width:100%; height:auto; border-radius:14px; display:block; object-fit:cover; aspect-ratio:4/5;}
.about-text{display:flex; flex-direction:column; gap:16px; max-width:68ch;}
@media (max-width:700px){ .about-intro{grid-template-columns:1fr; gap:24px;} .about-photo{max-width:220px;} }
.nowrap{white-space:nowrap;}
.name-story{display:flex; flex-direction:column; gap:14px; max-width:68ch;}
.name-story p{font-size:var(--lead-size); line-height:1.65; color:var(--ink-soft);}
.name-story strong{color:var(--green-deep); font-weight:700;}
.name-story .who-tag{font-weight:300; font-size:clamp(19px,2vw,24px); line-height:1.4; color:var(--green-deep);}
.section-head:has(.lede-wide){max-width:none;}
.lede-wide{max-width:none !important;}
.who-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,0.85fr); gap:44px; align-items:center;}
.who-img{width:100%; height:auto; border-radius:14px; display:block;}
@media (max-width:820px){ .who-grid{grid-template-columns:1fr; gap:28px;} }

/* ---------- references (Method: Foundations) ---------- */
.ref-block{margin-top:28px; padding-top:20px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:10px; max-width:760px;}
.ref-title{font-family:'Almarai', Arial, sans-serif; font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft);}
.ref-list{margin:0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:6px; font-size:13px; line-height:1.55; color:var(--ink-soft);}
.ref-list cite{font-style:italic;}
.ref-link{font-size:14px;}
.ref-link a{color:var(--green-deep); font-weight:700; text-decoration:underline; text-underline-offset:3px;}

/* ---------- price note, FAQ, partner quotes (7 Oct 2026) ---------- */
.price-note{font-size:12.5px; line-height:1.55; color:var(--ink-soft); margin-top:14px;}
.faq{max-width:760px; display:flex; flex-direction:column; gap:40px;}
.faq-group{display:flex; flex-direction:column; gap:22px;}
.faq-group h2{font-size:clamp(20px,2.6vw,24px); padding-bottom:10px; border-bottom:1px solid var(--line);}
.faq-item{display:flex; flex-direction:column; gap:8px;}
.faq-item h3{font-size:17px; color:var(--ink);}
.faq-item p, .faq-item li{font-size:15.5px; line-height:1.7; color:var(--ink-soft);}
.faq-item ol, .faq-item ul{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px;}
.faq-item strong{color:var(--ink);}
.faq-item .price-note{margin-top:2px;}
.quote-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:820px){ .quote-grid{grid-template-columns:1fr;} }
.quote-card{margin:0; border:1px solid var(--line); border-radius:14px; padding:26px 24px; background:var(--paper); display:flex; flex-direction:column; gap:18px;}
.quote-card blockquote{margin:0; font-size:15.5px; line-height:1.65; color:var(--ink);}
.quote-card figcaption{margin-top:auto; font-size:13px; line-height:1.5; color:var(--ink-soft); border-top:1px solid var(--line); padding-top:12px;}
.quote-card figcaption strong{display:block; color:var(--ink); font-weight:700;}

/* ---------- Method: six reports route (7 Oct 2026) ---------- */
.rt-route{list-style:none; margin:0; padding:0; position:relative; display:flex; flex-direction:column; gap:14px; max-width:860px;}
.rt-route::before{content:""; position:absolute; left:19px; top:22px; bottom:22px; width:2px; background:linear-gradient(var(--green), var(--amber));}
.rt-stop{display:grid; grid-template-columns:40px 1fr; gap:16px; align-items:start; position:relative;}
.rt-dot{width:40px; height:40px; border-radius:50%; background:var(--paper); border:2px solid var(--green); display:grid; place-items:center; font-weight:800; font-size:15px; color:var(--green); position:relative; z-index:1;}
.rt-last .rt-dot{border-color:var(--amber); color:var(--amber);}
.rt-card{background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:20px 22px; min-width:0; display:flex; flex-direction:column; gap:10px;}
.rt-start .rt-card{border-color:var(--green); box-shadow:0 0 0 3px var(--green-tint);}
.rt-tag{display:inline-block; width:fit-content; background:var(--green-tint); color:var(--green-deep); font-size:11.5px; font-weight:700; letter-spacing:0.04em; padding:3px 10px; border-radius:999px;}
.rt-top{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:baseline;}
.rt-meta{font-family:'Almarai', Arial, sans-serif; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft);}
.rt-price{font-weight:700; color:var(--ink); white-space:nowrap;}
.rt-price small{font-weight:400; color:var(--ink-soft); font-size:13px;}
.rt-card h3{font-size:19px; line-height:1.3;}
.rt-find{font-size:15px; line-height:1.6; color:var(--ink-soft);}
.rt-example{border-left:3px solid var(--green); padding:2px 0 2px 12px; font-size:14.5px; line-height:1.55; color:var(--ink);}
.rt-last .rt-example{border-left-color:var(--amber);}
.rt-ex-label{display:block; font-family:'Almarai', Arial, sans-serif; font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:2px;}
.rt-more{border-top:1px solid var(--line); padding-top:10px;}
.rt-more summary{cursor:pointer; font-weight:700; font-size:14px; color:var(--green-deep); list-style:none;}
.rt-more summary::-webkit-details-marker{display:none;}
.rt-more summary::after{content:" +";}
.rt-more[open] summary::after{content:" \2013";}
.rt-more summary:focus-visible{outline:2px solid var(--green-bright); outline-offset:3px; border-radius:4px;}
.rt-more dl{display:grid; grid-template-columns:max-content 1fr; gap:6px 16px; margin:12px 0 0; font-size:14px; line-height:1.55;}
.rt-more dt{color:var(--ink-soft); font-weight:700;}
.rt-more dd{margin:0; color:var(--ink);}
@media (max-width:560px){ .rt-more dl{grid-template-columns:1fr; gap:2px;} .rt-more dd{margin-bottom:8px;} }
.rt-included{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:36px; max-width:860px;}
.rt-inc{border-top:2px solid var(--green); padding-top:10px; font-size:14.5px; line-height:1.55; color:var(--ink-soft);}
.rt-inc b{display:block; color:var(--ink); margin-bottom:4px;}
.rt-verdicts{display:block; color:var(--ink);}
@media (max-width:700px){ .rt-included{grid-template-columns:1fr;} }
.rt-pricing{display:flex; flex-direction:column; gap:18px; margin-top:52px;}
.rt-rules{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media (max-width:820px){ .rt-rules{grid-template-columns:1fr;} }
.rt-rule{background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:20px; display:flex; flex-direction:column; gap:8px;}
.rt-rule h3{font-size:16px;}
.rt-rule p{font-size:14.5px; line-height:1.55; color:var(--ink-soft);}
.rt-chips{display:flex; flex-wrap:wrap; gap:6px;}
.rt-chips span{font-size:12.5px; border:1px solid var(--line); border-radius:999px; padding:3px 10px; color:var(--ink);}
.rt-paid{font-size:16px; color:var(--ink-soft);}
.rt-paid b{color:var(--green-deep);}
.rt-mandate{display:grid; grid-template-columns:1.4fr 1fr; gap:24px; align-items:center; border:1px solid var(--green); border-radius:14px; padding:26px; background:var(--paper); box-shadow:var(--shadow); margin-top:36px;}
.rt-mandate h2{font-size:clamp(20px,2.6vw,26px); margin-top:6px;}
.rt-mandate p{color:var(--ink-soft); font-size:15px; line-height:1.6; margin-top:8px;}
.rt-cta{display:flex; flex-direction:column; gap:12px; align-items:flex-start;}
.rt-big{font-size:30px; font-weight:800; color:var(--ink);}
@media (max-width:700px){ .rt-mandate{grid-template-columns:1fr;} }
