/* rsvglobal.co: shared stylesheet for service and case pages.
 *
 * index.html deliberately keeps its own inline CSS: it is the page most likely
 * to be opened straight from disk and it carries hero treatments nothing else
 * uses. Everything below is the shared system for the pages under /services/
 * and /work/, so a change to the nav or a button lands in one place instead of
 * ten. See AGENTS.md.
 */

:root{
--paper:#f4f0e7;--ink:#161712;--muted:#64655e;--blue:#2448ff;--red:#ef5a3c;
--lime:#c8f24b;--cream:#fffaf0;--dark:#141812;--softblue:#dfe4ff;--softred:#ffd9cf;
--max:1380px;--g:clamp(24px,4vw,72px);--sans:Arial,"Helvetica Neue",sans-serif;
--mono:"SFMono-Regular",Consolas,monospace;--ease:cubic-bezier(.2,.8,.2,1)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:var(--blue);color:#fff}
.shell{width:min(100%,calc(var(--max) + (var(--g)*2)));padding-left:var(--g);padding-right:var(--g);margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--g);top:12px;z-index:200;background:var(--lime);border:1px solid var(--ink);padding:12px 16px;font:800 10px var(--mono);text-transform:uppercase}

/* nav */
.navwrap{position:fixed;z-index:80;top:0;left:0;right:0;padding:13px var(--g)}
.nav{max-width:var(--max);height:58px;margin:auto;background:rgba(255,250,240,.9);backdrop-filter:blur(16px);border:1px solid var(--ink);border-radius:100px;display:flex;align-items:center;padding:0 9px 0 20px;gap:20px;box-shadow:4px 4px 0 var(--ink)}
.logo{display:flex;align-items:center;white-space:nowrap}
.logo i{width:12px;height:12px;background:var(--blue);border-radius:50%;box-shadow:13px 0 0 var(--red);margin-right:22px;flex:none}
.logo .lock{display:flex;flex-direction:column;line-height:1}
.logo .lock b{font-size:15px;letter-spacing:-.035em;font-weight:800}
.logo .lock em{font:700 7.5px var(--mono);font-style:normal;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-top:3px}
.links{display:flex;gap:21px;margin-left:auto;font:700 10px var(--mono);text-transform:uppercase;letter-spacing:.08em}
.links a:hover{color:var(--blue)}
.navcta{margin-left:10px;border:1px solid var(--ink);background:var(--lime);border-radius:100px;padding:13px 18px;font:800 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;transition:.22s;white-space:nowrap}
.navcta:hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink)}

/* buttons */
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 19px;border:1px solid var(--ink);border-radius:100px;font:800 10px var(--mono);text-transform:uppercase;letter-spacing:.07em;background:var(--cream);transition:.22s;cursor:pointer}
.button.primary{background:var(--blue);color:#fff}
.button:hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink)}
.buttons{display:flex;gap:10px;margin-top:25px;flex-wrap:wrap}

/* sections */
section{padding-top:clamp(64px,7vw,110px);padding-bottom:clamp(64px,7vw,110px)}
section[id]{scroll-margin-top:96px}
.head{display:grid;grid-template-columns:180px minmax(0,1fr);gap:34px;margin-bottom:48px}
.head .label{font:800 10px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--blue);padding-top:11px}
.head h2{font-size:clamp(34px,4.4vw,62px);line-height:.98;letter-spacing:-.055em;margin:0;max-width:960px}
.head p{grid-column:2;max-width:760px;font-size:18px;line-height:1.58;color:var(--muted);margin:18px 0 0}

/* service page hero */
.shero{padding-top:132px;padding-bottom:clamp(48px,6vw,84px)}
.crumb{font:700 10px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 26px}
.crumb a:hover{color:var(--blue)}
.shero h1{font-size:clamp(42px,6.6vw,96px);line-height:.92;letter-spacing:-.068em;margin:0 0 26px;max-width:1120px}
.shero h1 em{font-style:normal;color:var(--blue)}
.shero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:clamp(28px,4vw,60px);align-items:start;margin-top:8px}
.shero-lede{font-size:clamp(18px,1.7vw,23px);line-height:1.42;letter-spacing:-.025em;margin:0;color:#33352d}
.shero-card{border:1px solid var(--ink);background:var(--cream);box-shadow:8px 8px 0 var(--ink);padding:clamp(22px,2.6vw,30px)}
.shero-card b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--blue);margin-bottom:14px}
.shero-card ul{list-style:none;margin:0;padding:0}
.shero-card li{padding:9px 0;border-bottom:1px solid rgba(22,23,18,.14);font-size:15px;line-height:1.45}
.shero-card li:last-child{border-bottom:0}

/* generic card grid */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.card{border:1px solid var(--ink);background:var(--cream);padding:26px}
.card b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin-bottom:18px}
.card h3{font-size:clamp(19px,1.9vw,25px);line-height:1.08;letter-spacing:-.04em;margin:0 0 11px}
.card p{margin:0;color:#41423d;line-height:1.55;font-size:15px}

/* numbered steps */
.steps{border:1px solid var(--ink);background:var(--ink);display:grid;gap:1px;grid-template-columns:repeat(2,minmax(0,1fr))}
.step{background:var(--cream);padding:24px}
.step b{font:800 10px var(--mono);color:var(--blue)}
.step h4{font-size:19px;letter-spacing:-.035em;margin:14px 0 8px}
.step p{margin:0;font-size:15px;line-height:1.5;color:#41423d}

/* deliverables list */
.deliver{border:1px solid var(--ink);background:var(--cream)}
.drow{display:grid;grid-template-columns:52px minmax(0,1fr);gap:20px;padding:20px 24px;border-bottom:1px solid rgba(22,23,18,.15);align-items:baseline}
.drow:last-child{border-bottom:0}
.drow b{font:800 10px var(--mono);color:var(--blue)}
.drow span{font-size:16px;line-height:1.5}

/* boundary callout, dark */
.callout{background:var(--dark);color:#f9f5ea;border:1px solid var(--ink);padding:clamp(26px,3.2vw,44px)}
.callout b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--lime);margin-bottom:16px}
.callout h3{font-size:clamp(24px,2.9vw,38px);line-height:1.03;letter-spacing:-.048em;margin:0 0 14px;max-width:820px}
.callout p{margin:0;color:#c3c4b9;line-height:1.6;max-width:780px;font-size:16px}

/* proof strip */
.proofrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.proofcard{border:1px solid var(--ink);background:var(--softblue);padding:26px}
.proofcard b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--blue);margin-bottom:14px}
.proofcard h3{font-size:clamp(20px,2vw,27px);letter-spacing:-.04em;line-height:1.06;margin:0 0 10px}
.proofcard p{margin:0;font-size:15px;line-height:1.55;color:#33352d}

/* closing CTA */
.cta{background:var(--blue);color:#fff;border:1px solid var(--ink);box-shadow:12px 12px 0 var(--ink);padding:clamp(30px,4.4vw,64px)}
.cta b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--lime);margin-bottom:18px}
.cta h2{font-size:clamp(32px,4.6vw,66px);line-height:.95;letter-spacing:-.06em;margin:0 0 18px;max-width:940px}
.cta p{font-size:18px;line-height:1.5;max-width:660px;margin:0 0 6px}
.cta .button{background:var(--lime);color:var(--ink)}

/* other services */
.also{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.also a{border:1px solid var(--ink);background:var(--cream);padding:18px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:15px;font-weight:700;letter-spacing:-.02em;transition:.2s var(--ease)}
.also a:hover{background:var(--lime);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink)}
.also a i{font-style:normal;color:var(--blue)}

/* footer */
footer{border-top:1px solid var(--ink);padding:30px 0 46px}
.footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font:700 9px var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.footer a:hover{color:var(--blue)}

.reveal{opacity:0;transform:translateY(20px);transition:.6s var(--ease)}
.reveal.in{opacity:1;transform:none}

@media(max-width:1060px){
.links{display:none}
.head,.shero-grid{grid-template-columns:1fr}
.head p{grid-column:1}
.grid3,.also{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
:root{--g:20px}
.navwrap{padding:9px 12px}.nav{height:54px;padding-left:15px}.navcta{padding:11px 13px;font-size:9px}
.shero{padding-top:104px}
.grid3,.grid2,.steps,.proofrow,.also{grid-template-columns:1fr}
.drow{grid-template-columns:38px minmax(0,1fr);gap:12px;padding:17px 18px}
.footer{flex-direction:column;gap:10px}
.button{width:100%}
}
@media(max-width:430px){.logo .lock em{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* case study: AI boundary, two columns */
.bgrid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bcol2{border:1px solid var(--ink);padding:clamp(24px,3vw,34px)}
.bcol2.yes{background:var(--dark);color:#f9f5ea}
.bcol2.no{background:var(--dark);color:#f9f5ea}
.bcol2 b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:20px}
.bcol2.yes b{color:var(--lime)}
.bcol2.no b{color:var(--red)}
.bcol2 ul{list-style:none;margin:0;padding:0}
.bcol2 li{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.2);font-size:16px;line-height:1.45}
.bcol2 li:last-child{border-bottom:0}

/* honest placeholder for evidence we do not have yet */
.soon{border:1px dashed rgba(22,23,18,.4);background:rgba(255,250,240,.5);padding:clamp(26px,3.4vw,44px);text-align:center}
.soon b{display:block;font:800 9px var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--blue);margin-bottom:14px}
.soon p{margin:0 auto;max-width:620px;color:var(--muted);line-height:1.6;font-size:16px}

/* card used for constraints and decisions needs a heading rhythm */
.card h3{margin-top:0}

@media(max-width:720px){.bgrid2{grid-template-columns:1fr}}
