
/* ============================================================
   IVEON — SOLUTION DETAIL SYSTEM / LOT 4
   White + grey dominant. Black used as editorial punctuation.
   Photography carries color.
   ============================================================ */
.sd-page{overflow:hidden;background:#fff}
.sd-hero{position:relative;min-height:92svh;padding:calc(var(--header) + 80px) 0 86px;display:flex;align-items:flex-end;background:#fff}
.sd-hero .wrap{position:relative;z-index:2}
.sd-hero .eyebrow{margin-bottom:34px}
.sd-hero h1{margin:0;max-width:1300px;font-size:clamp(64px,9vw,150px);line-height:.88;letter-spacing:-.065em;font-weight:500}
.sd-hero-lede{display:grid;grid-template-columns:minmax(300px,720px) auto;align-items:end;gap:70px;margin-top:52px}
.sd-hero-lede p{margin:0;max-width:720px;font-size:clamp(19px,1.55vw,26px);line-height:1.5;letter-spacing:-.018em;color:#4d4d48}
.sd-hero--image{min-height:100svh;color:#fff;background:#111}
.sd-hero--image .sd-hero-media{position:absolute;inset:0;background:center/cover no-repeat;filter:saturate(.86)}
.sd-hero--image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.58))}
.sd-hero--image .sd-hero-lede p{color:#ecece7}
.sd-hero--split{padding:0;display:grid;grid-template-columns:.96fr 1.04fr;align-items:stretch;min-height:100svh}
.sd-hero--split .sd-hero-copy{padding:calc(var(--header) + 90px) var(--gutter) 86px;display:flex;flex-direction:column;justify-content:flex-end;background:#fff}
.sd-hero--split .sd-hero-copy h1{font-size:clamp(62px,7.7vw,130px)}
.sd-hero--split .sd-hero-copy p{max-width:620px;margin:42px 0 0;color:#55554f;font-size:clamp(18px,1.35vw,23px);line-height:1.55}
.sd-hero--split .sd-hero-media{min-height:100svh;background:center/cover no-repeat}
.sd-hero--paper{background:var(--paper)}

.sd-section{padding:clamp(100px,11vw,180px) 0;background:#fff}
.sd-section.paper{background:var(--paper)}
.sd-section.soft{background:#ecece8}
.sd-kicker{margin:0 0 24px;font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.sd-title{margin:0;max-width:1250px;font-size:clamp(46px,6.4vw,105px);line-height:.94;letter-spacing:-.057em;font-weight:500}
.sd-title-sm{margin:0;max-width:950px;font-size:clamp(38px,4.7vw,76px);line-height:.98;letter-spacing:-.048em;font-weight:500}
.sd-copy{max-width:760px;color:#4f4f49;font-size:clamp(18px,1.35vw,22px);line-height:1.62;letter-spacing:-.012em}
.sd-copy p{margin:0 0 25px}
.sd-copy p:last-child{margin-bottom:0}

.sd-intro-grid{display:grid;grid-template-columns:.62fr 1.38fr;gap:9vw;align-items:start}
.sd-intro-grid .sd-copy{margin-top:70px}
.sd-longform{max-width:980px;margin-left:auto}
.sd-longform p{margin:0 0 28px;color:#44443f;font-size:clamp(19px,1.45vw,24px);line-height:1.66;letter-spacing:-.014em}
.sd-longform p:first-of-type{font-size:clamp(25px,2vw,34px);line-height:1.45;color:#171715}

.sd-cinema{position:relative;min-height:74svh;background:center/cover no-repeat;color:#fff}
.sd-cinema:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.42))}
.sd-cinema .wrap{position:absolute;z-index:2;left:0;right:0;bottom:44px}
.sd-cinema-caption{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end}
.sd-cinema-caption p{margin:0;max-width:600px;font-size:18px;line-height:1.55}
.sd-cinema-caption .sd-kicker{margin:0}

.sd-split{display:grid;grid-template-columns:1fr 1fr;min-height:82svh;background:#fff}
.sd-split.reverse .sd-split-media{order:2}
.sd-split.reverse .sd-split-copy{order:1}
.sd-split-media{min-height:620px;background:center/cover no-repeat}
.sd-split-copy{padding:clamp(76px,8vw,135px) clamp(44px,6vw,105px);display:flex;flex-direction:column;justify-content:center;background:var(--paper)}
.sd-split-copy.white{background:#fff}
.sd-split-copy .sd-title-sm{margin-bottom:38px}
.sd-split-copy .sd-copy{font-size:18px}
.sd-split-copy .link{margin-top:42px;align-self:flex-start}

.sd-rule{border-top:1px solid var(--line)}
.sd-rule-row{display:grid;grid-template-columns:85px minmax(0,1fr) minmax(250px,.6fr);gap:38px;padding:38px 0;border-bottom:1px solid var(--line);align-items:start}
.sd-rule-row .num{color:#8b8b84;font-size:10px;font-weight:800;letter-spacing:.14em}
.sd-rule-row h3{margin:0;font-size:clamp(30px,3.1vw,52px);line-height:1.02;letter-spacing:-.044em;font-weight:500}
.sd-rule-row p{margin:4px 0 0;color:#63635d;font-size:16px;line-height:1.55}

.sd-flow{display:grid;grid-template-columns:repeat(5,1fr);margin-top:72px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.sd-flow-step{min-height:260px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.sd-flow-step span{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#85857f}
.sd-flow-step strong{font-size:clamp(25px,2.1vw,36px);line-height:1.05;letter-spacing:-.038em;font-weight:500}
.sd-flow-step p{margin:18px 0 0;color:#66665f;font-size:14px;line-height:1.5}

.sd-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:72px}
.sd-card{min-height:320px;padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;background:transparent}
.sd-card.wide{grid-column:span 2}
.sd-card .meta{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#808079}
.sd-card h3{margin:52px 0 18px;max-width:430px;font-size:clamp(30px,3vw,50px);line-height:1.02;letter-spacing:-.045em;font-weight:500}
.sd-card p{margin:0;max-width:450px;color:#60605a;font-size:15px;line-height:1.55}
.sd-card .link{margin-top:30px;align-self:flex-start}

.sd-arch{margin-top:72px;border:1px solid var(--line);background:#fff}
.sd-arch-row{display:grid;grid-template-columns:170px 1fr;min-height:118px;border-bottom:1px solid var(--line)}
.sd-arch-row:last-child{border-bottom:0}
.sd-arch-label{padding:27px;border-right:1px solid var(--line);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#777771}
.sd-arch-nodes{padding:22px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.sd-node{padding:12px 15px;border:1px solid #c9c9c3;background:#f8f8f6;font-size:13px}
.sd-node.em{background:#111;color:#fff;border-color:#111}

.sd-dual{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:70px}
.sd-dual-block{min-height:360px;padding:38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.sd-dual-block .meta{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#808079}
.sd-dual-block h3{margin:64px 0 20px;font-size:clamp(34px,3.5vw,58px);line-height:1;letter-spacing:-.047em;font-weight:500}
.sd-dual-block p{margin:0;max-width:560px;color:#5f5f59;font-size:16px;line-height:1.6}

.sd-band{padding:88px 0;background:#111;color:#fff}
.sd-band-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:80px;align-items:center}
.sd-band .sd-title-sm{max-width:900px}
.sd-band p{max-width:720px;margin:34px 0 0;color:#bdbdb6;font-size:18px;line-height:1.58}

.sd-proof{padding:clamp(100px,11vw,170px) 0;background:#fff}
.sd-proof-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:9vw;align-items:start}
.sd-proof-copy{padding-top:6px}
.sd-proof-copy .sd-title-sm{margin:24px 0 34px}
.sd-proof-copy p{max-width:680px;margin:0;color:#55554f;font-size:18px;line-height:1.6}
.sd-proof-copy .link{margin-top:38px}
.sd-proof-panel{min-height:460px;background:var(--paper);padding:44px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line)}
.sd-proof-panel .meta{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#777771}
.sd-proof-panel h3{margin:0;max-width:720px;font-size:clamp(38px,4.2vw,68px);line-height:.99;letter-spacing:-.05em;font-weight:500}
.sd-proof-panel p{max-width:620px;margin:0;color:#5b5b55;font-size:16px;line-height:1.58}

.sd-final{min-height:66svh;padding:clamp(105px,11vw,170px) 0;display:flex;align-items:center;background:var(--paper)}
.sd-final.white{background:#fff;border-top:1px solid var(--line)}
.sd-final.dark{background:#111;color:#fff}
.sd-final .sd-title{margin:24px 0 54px;max-width:1180px}
.sd-final-bottom{display:grid;grid-template-columns:minmax(300px,680px) auto;gap:70px;align-items:end}
.sd-final-bottom p{margin:0;color:#5e5e58;font-size:18px;line-height:1.58}
.sd-final.dark .sd-final-bottom p{color:#bdbdb6}

.sd-caption{padding:16px var(--gutter);color:#777771;font-size:10px;letter-spacing:.04em;background:#fff}
.sd-quote{padding:clamp(100px,12vw,190px) 0;background:#fff}
.sd-quote blockquote{margin:0;max-width:1400px;font-size:clamp(46px,6.4vw,104px);line-height:.96;letter-spacing:-.057em;font-weight:500}
.sd-quote .sd-kicker{margin-bottom:70px}

@media(max-width:1050px){
  .sd-hero-lede,.sd-intro-grid,.sd-cinema-caption,.sd-band-grid,.sd-proof-grid,.sd-final-bottom{grid-template-columns:1fr}
  .sd-hero--split{grid-template-columns:1fr}
  .sd-hero--split .sd-hero-media{min-height:64svh;order:-1}
  .sd-split{grid-template-columns:1fr}
  .sd-split.reverse .sd-split-media,.sd-split.reverse .sd-split-copy{order:initial}
  .sd-split-media{min-height:62svh}
  .sd-flow{grid-template-columns:repeat(2,1fr)}
  .sd-grid{grid-template-columns:1fr 1fr}.sd-card.wide{grid-column:span 2}
  .sd-rule-row{grid-template-columns:60px 1fr}.sd-rule-row p{grid-column:2}
}
@media(max-width:720px){
  .sd-hero{min-height:calc(90svh - 72px);padding:calc(var(--header) + 65px) 0 58px}
  .sd-hero--image{min-height:calc(100svh - 72px)}
  .sd-hero h1{font-size:clamp(56px,16vw,82px)}
  .sd-hero-lede{margin-top:36px;gap:28px}
  .sd-hero-lede p{font-size:18px}
  .sd-hero--split .sd-hero-copy{padding:90px 22px 72px}.sd-hero--split .sd-hero-media{min-height:56svh}
  .sd-section{padding:96px 0}.sd-intro-grid{gap:68px}.sd-intro-grid .sd-copy{margin-top:0}
  .sd-longform p{font-size:18px}.sd-longform p:first-of-type{font-size:23px}
  .sd-cinema{min-height:62svh}.sd-cinema .wrap{bottom:28px}.sd-cinema-caption{gap:18px}
  .sd-split-copy{padding:82px 22px}.sd-split-media{min-height:55svh}
  .sd-flow,.sd-grid,.sd-dual{grid-template-columns:1fr}.sd-card.wide{grid-column:auto}
  .sd-flow-step{min-height:210px}.sd-card{min-height:280px}
  .sd-rule-row{grid-template-columns:34px 1fr;gap:18px;padding:30px 0}.sd-rule-row p{grid-column:2}
  .sd-arch-row{grid-template-columns:1fr}.sd-arch-label{border-right:0;border-bottom:1px solid var(--line)}
  .sd-proof-panel{min-height:390px;padding:30px}
  .sd-final{min-height:0;padding:96px 0}.sd-final .sd-title{margin-bottom:38px}
  .sd-quote{padding:98px 0}.sd-quote .sd-kicker{margin-bottom:55px}
}
