/* SC Partners — homepage styles */
:root{
  --navy:#00254F; --navy-2:#062E5E; --deep:#001A3A; --blue:#0068FE; --blue-soft:#8FB8FF;
  --orange:#FE7200; --green:#5AA828; --mist:#F4F6FA;
  --paper:#FFFFFF; --ink:#00254F; --muted:#5B6980; --line:#DEE4ED;
  --on-dark-muted:#A9B9D0; --hair-dark:rgba(255,255,255,.14);
  --bar-h:74px;
  --f:"Montserrat","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--bar-h) + 8px)}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
.wrap{max-width:1160px;margin:0 auto;padding-inline:clamp(20px,5vw,56px)}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{text-wrap:balance;letter-spacing:-.02em}
a{color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
section{padding-block:clamp(52px,6vw,76px)}
.dark{background:var(--navy);color:#fff}
.kicker{font-size:11.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--blue)}
.dark .kicker{color:var(--blue-soft)}
.h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;line-height:1.15}
.kicker + .h2{margin-top:12px}
.pt{color:var(--blue)}
.lede{margin-top:12px;color:var(--muted);font-size:17px;font-weight:400;max-width:56ch}
.dark .lede{color:var(--on-dark-muted)}
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--blue);color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:14px 24px;border-radius:3px;transition:background .2s,gap .2s;white-space:nowrap}
.btn:hover{background:#0057d9;gap:16px}
.btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.plabel{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.plabel.s{color:var(--orange)} .plabel.g{color:var(--green)} .plabel.c{color:var(--blue)}

/* header */
header.bar{position:fixed;top:0;left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top,0px);background:var(--navy);border-bottom:1px solid var(--hair-dark);box-shadow:0 2px 14px rgba(0,26,58,.18)}
main{padding-top:var(--bar-h)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--bar-h)}
.bar .logo img{height:28px;width:auto;display:block}
.bar nav{display:flex;align-items:center;gap:34px}
.bar nav a{color:var(--on-dark-muted);text-decoration:none;font-size:13.5px;font-weight:500;transition:color .2s}
.bar nav a:hover{color:#fff}
.bar nav .btn{color:#fff;padding:11px 20px;font-size:13.5px}
@media (max-width:860px){.bar nav a:not(.btn){display:none}}

/* hero */
.hero{position:relative;overflow:hidden;display:flex;align-items:center;padding-block:clamp(64px,8vw,96px) clamp(96px,10vw,120px);min-height:calc(100vh - var(--bar-h));min-height:calc(100svh - var(--bar-h))}
.hero .inner{width:100%}
.scroll-cue{position:absolute;left:50%;bottom:clamp(20px,3.5vh,36px);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--on-dark-muted);text-decoration:none;font-size:11px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;transition:color .2s}
.scroll-cue:hover{color:#fff}
.scroll-cue svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;animation:cue 2.2s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(5px);opacity:1}}
@media (prefers-reduced-motion: reduce){.scroll-cue svg{animation:none}}
@media (max-height:560px){.scroll-cue{display:none}}
.hero .ghost{position:absolute;right:-4%;top:50%;transform:translateY(-50%);font-weight:800;font-size:clamp(280px,40vw,600px);line-height:.8;letter-spacing:-.06em;white-space:nowrap;pointer-events:none;user-select:none}
.hero .ghost span:first-child{color:rgba(255,255,255,.05)} .hero .ghost span:last-child{color:rgba(0,104,254,.16)}
.hero .inner{position:relative}
.hero h1{font-size:clamp(42px,6vw,76px);font-weight:800;line-height:1.03;letter-spacing:-.03em;max-width:13ch}
.hero h1 em{font-style:normal;color:var(--blue)}
.hero .sub{font-size:clamp(18px,2vw,22px);font-weight:400;color:#DCE5F2;margin-top:22px}
.hero .pillars{margin-top:18px;font-size:12px;font-weight:600;letter-spacing:.34em;color:var(--on-dark-muted)}
.hero .btn{margin-top:34px}

/* questions */
.qs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.q{background:var(--mist);padding:28px 28px 32px}
.q .plabel{display:block}
.q p{position:relative;margin-top:12px;padding-left:40px;font-size:17px;line-height:1.55}
.q p::before{content:"\201C";position:absolute;left:0;top:-8px;font-size:52px;font-weight:800;line-height:1;color:var(--blue)}
@media (max-width:880px){.qs{grid-template-columns:minmax(0,1fr)}}

/* results */
.results-sec{background:var(--mist)}
.results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.rc{background:var(--paper);display:flex;flex-direction:column}
.rc .art{aspect-ratio:16/7.5;max-width:100%;background:linear-gradient(160deg,var(--navy-2),var(--deep));position:relative;overflow:hidden}
.rc .art img{width:100%;height:100%;object-fit:cover;display:block}
.rc .body{padding:22px 26px 28px;display:grid;gap:2px}
.rc .sub2{font-size:14px;color:var(--muted);margin-top:4px;min-height:2.9em;line-height:1.45}
@media (max-width:900px){.rc .sub2{min-height:0}}
.rc .big{font-size:24px;font-weight:800;line-height:1.2;margin-top:10px}
.rc .when{font-size:15px;color:var(--muted)}
@media (max-width:900px){.results{grid-template-columns:minmax(0,1fr);max-width:520px}}

/* approach */
.approach .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(32px,5vw,64px);align-items:center}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.st{text-align:center;position:relative;display:flex;flex-direction:column;align-items:center}
.st .ic{width:76px;height:76px;border-radius:50%;border:2px solid var(--blue);display:grid;place-items:center;background:rgba(0,104,254,.08)}
.st .ic svg{width:34px;height:34px;stroke:var(--blue-soft);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.st h3{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-top:18px}
.st p{font-size:14px;color:var(--on-dark-muted);margin-top:6px;line-height:1.45;max-width:15ch}
.st:not(:last-child)::after{content:"";position:absolute;right:-10px;top:34px;width:8px;height:8px;border-top:2px solid var(--blue-soft);border-right:2px solid var(--blue-soft);transform:rotate(45deg);opacity:.7}
.flowline{grid-column:2;display:flex;align-items:center;gap:16px;margin-top:-28px;font-size:11.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--blue-soft)}
.flowline::before,.flowline::after{content:"";flex:1;height:1.5px;background:var(--blue)}
.flowline::after{order:2}
.flowline svg{order:3;width:14px;height:14px;flex:none;stroke:var(--blue);fill:none;stroke-width:2;margin-left:-22px}
@media (max-width:980px){.approach .wrap{grid-template-columns:minmax(0,1fr)}.flowline{grid-column:1}}
@media (max-width:560px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}.st::after{display:none}}

/* who */
.who .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:44px}
.crit{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.cr{padding:6px 20px;border-left:1px solid var(--line);text-align:center;display:flex;flex-direction:column;align-items:center}
.cr:first-child{border-left:0}
.cr svg{width:36px;height:36px;stroke:var(--blue);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cr p{font-size:16px;font-weight:500;line-height:1.45;margin-top:16px}
@media (max-width:980px){.who .wrap{grid-template-columns:minmax(0,1fr)}}
@media (max-width:620px){.crit{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}.cr:nth-child(3){border-left:0}}

/* why */
.why{position:relative;overflow:hidden}
.why .ghost{position:absolute;right:-3%;top:-8%;font-weight:800;font-size:clamp(200px,26vw,380px);line-height:.8;letter-spacing:-.06em;color:rgba(255,255,255,.04);pointer-events:none;user-select:none}
.why .wrap{position:relative}
.why .h2{font-size:clamp(26px,3.2vw,36px)}
.exp{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:40px}
.ex{display:grid;gap:16px;align-content:start;padding:4px 28px;border-left:1px solid var(--hair-dark)}
.ex:first-child{border-left:0;padding-left:0}
.ex svg{width:40px;height:40px;stroke:var(--blue);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ex b{display:block;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.ex span{display:block;font-size:14px;color:var(--on-dark-muted);margin-top:6px;line-height:1.5}
.areas{margin-top:44px;padding-top:22px;border-top:1px solid var(--hair-dark);display:flex;flex-wrap:wrap;align-items:center;gap:10px 0;font-size:13.5px;color:#DCE5F2}
.areas span{padding-inline:16px;border-left:1px solid var(--hair-dark);white-space:nowrap}
.areas .kicker{flex-basis:100%;padding:0 0 6px;border-left:0;color:#fff;font-size:11px;letter-spacing:.18em}
.areas .kicker + span{padding-left:0;border-left:0}
.areas span:not(.kicker){padding-inline:20px}.areas .kicker + span{padding-left:0}
@media (max-width:980px){.exp{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}.ex:nth-child(3){border-left:0;padding-left:0}}
@media (max-width:560px){.exp{grid-template-columns:minmax(0,1fr)}.ex{border-left:0;padding-left:0}.areas span{padding-inline:0 16px;border-left:0}}

/* closing */
.closing{position:relative;overflow:hidden;background:linear-gradient(115deg,var(--deep) 0%,var(--navy) 55%,#0A3D7A 100%)}
.closing .arc{position:absolute;right:-6%;top:-40%;width:58%;height:180%;pointer-events:none}
.closing .wrap{position:relative}
.closing h2{font-size:clamp(26px,3.4vw,40px);font-weight:800;line-height:1.2;max-width:26ch}
.closing .say{font-size:clamp(17px,1.8vw,20px);color:#DCE5F2;margin-top:12px}
.closing .btn{margin-top:28px}
.closing .contact{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px 32px;font-size:14px;color:var(--on-dark-muted)}
.closing .contact b{color:#fff;font-weight:500;user-select:all}

footer{background:var(--paper);border-top:1px solid var(--line);padding-block:28px;font-size:13px;color:var(--muted)}
footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px 32px;flex-wrap:wrap}
footer img{height:24px;width:auto;display:block;flex:none}
.foot-line{margin:0;color:var(--ink);display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:4px 12px;line-height:24px}
.foot-line a{color:inherit;text-decoration:none}
.foot-line a:hover{color:var(--blue)}
.foot-line .sep{color:#B8C2D1}
@media (max-width:980px){.foot-line{justify-content:flex-start;gap:2px 18px}.foot-line .sep{display:none}}
@media (max-width:560px){.foot-line{flex-direction:column;align-items:flex-start}}
.closing .photo{position:absolute;top:0;right:0;bottom:0;width:62%;background:url(images/closing-skyline.jpg) center 55%/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 70%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 70%)}
.closing .arc{display:none}
@media (max-width:760px){.closing .photo{width:100%;opacity:.35;-webkit-mask-image:none;mask-image:none}}

.closing .contact a{color:inherit;text-decoration:none}
.closing .contact a:hover b{text-decoration:underline}

/* Keep every grid item inside its column (Safari sizes columns from image width otherwise) */
.q,.rc,.st,.cr,.ex{min-width:0}
.rc .art{width:100%}
.rc .art img{max-width:100%}
body{overflow-x:clip}