/* Inner pages (About, Solutions, FAQ, Resources, posts). Same tokens and voice as the homepage. */
:root{
  --ink:#1B1C1E; --ink2:#242528; --cream:#F4F1EA; --paper:#EBE6DB;
  --red:#A63328; --hot:#F03B2B; --line:rgba(27,28,30,.14);
  --h:'Archivo',system-ui,sans-serif; --b:'DM Sans',system-ui,sans-serif;
  --pad:clamp(20px,5vw,80px);
  --blip:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M0 13h6l2-3 2 3 2-11 3 20 2-9h7' fill='none' stroke='black' stroke-width='2.4' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ink)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--cream);color:var(--ink);font-family:var(--b);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%}
h1,h2,h3{font-family:var(--h);letter-spacing:-.02em;text-wrap:balance}
p,li{text-wrap:pretty}
.hot{color:var(--hot)}
.on-cream .hot{color:var(--red)}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}

/* nav: solid bar on inner pages */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;padding:10px var(--pad);background:rgba(27,28,30,.96)}
.nav .logo img{height:50px;width:auto;filter:brightness(0) invert(1)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 26px;border-radius:999px;background:var(--red);color:#fff;font:700 15px/1 var(--b);text-decoration:none;border:2px solid var(--red);transition:background-color .15s ease,transform .15s ease}
@media (hover:hover){.btn:hover{background:#c23d30}}
.btn:active{transform:scale(.96)}
.btn.light{background:var(--cream);color:var(--red);border-color:var(--cream)}
@media (hover:hover){.btn.light:hover{background:#fff}}
.btn.ghost{background:transparent;border-color:rgba(244,241,234,.75);color:var(--cream)}
.nav .btn{min-height:44px;padding:0 22px;font-size:14px}
.pulse-line{position:absolute;left:0;right:0;bottom:-2px;height:2px;background:linear-gradient(90deg,var(--hot),var(--hot)) 0 0/var(--read,0%) 100% no-repeat}

/* layout */
section{position:relative}
.sec{padding:clamp(80px,11vw,170px) var(--pad)}
.wrap{max-width:1240px;margin:0 auto}
.dark{background:var(--ink);color:var(--cream)}
.paper{background:var(--paper)}
h1{font:700 clamp(40px,6.6vw,100px)/.98 var(--h);letter-spacing:-.03em}
h2{font:700 clamp(32px,4.8vw,70px)/1.04 var(--h)}
h3{font:700 clamp(22px,2.2vw,30px)/1.12 var(--h)}
.lead{margin-top:22px;max-width:36em;font-size:clamp(18px,1.6vw,21px);color:rgba(27,28,30,.8)}
.dark .lead{color:rgba(244,241,234,.82)}
.body p{margin-top:18px;max-width:36em;font-size:clamp(17px,1.35vw,19px);color:rgba(27,28,30,.84)}
.dark .body p{color:rgba(244,241,234,.82)}
.body b{color:inherit}
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}.rv.d4{transition-delay:.32s}

/* page opening */
.ph-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:140px var(--pad) clamp(56px,8vw,110px);background:var(--ink);color:var(--cream);overflow:hidden}
.ph-hero .bgimg{position:absolute;inset:0;z-index:0}
.ph-hero .bgimg img{width:100%;height:100%;object-fit:cover;animation:push 14s ease-out both}
.ph-hero .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,18,20,.94) 0%,rgba(17,18,20,.74) 46%,rgba(17,18,20,.28) 100%),linear-gradient(0deg,rgba(17,18,20,.85),rgba(17,18,20,0) 50%)}
.ph-hero .wrap{position:relative;z-index:1;width:100%}
.ph-hero .lead{color:rgba(244,241,234,.86);max-width:30em}
.ph-hero h1{max-width:12em}
@keyframes push{from{transform:scale(1.08)}to{transform:scale(1)}}
.crumb{font:600 15px/1 var(--b);color:rgba(244,241,234,.7);margin-bottom:22px;display:flex;gap:10px;align-items:center}
.crumb::before{content:"";width:22px;height:14px;background:var(--hot);-webkit-mask:var(--blip) center/contain no-repeat;mask:var(--blip) center/contain no-repeat}

/* big statement line */
.statement{font:700 clamp(44px,8vw,128px)/.95 var(--h);letter-spacing:-.04em}
.statement em{font-style:normal;color:var(--hot)}
.on-cream .statement em{color:var(--red)}

/* two columns */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.two.top{align-items:start}
.photo{border-radius:10px;overflow:hidden;background:#000}
.photo img{width:100%;height:100%;object-fit:cover}

/* pull quote */
.body .pull,.pull{margin:clamp(40px,6vw,80px) 0;font:700 clamp(26px,3.2vw,46px)/1.12 var(--h);letter-spacing:-.02em;max-width:22em}
.pull::before{content:"";display:block;width:44px;height:26px;margin-bottom:14px;background:var(--red);-webkit-mask:var(--blip) left center/contain no-repeat;mask:var(--blip) left center/contain no-repeat}
.dark .pull::before{background:var(--hot)}

/* ledger rows */
.rows{margin-top:clamp(36px,5vw,64px);display:grid;max-width:1080px}
.rows>div{display:grid;grid-template-columns:minmax(200px,.45fr) 1fr;gap:clamp(16px,3vw,48px);align-items:baseline;padding:clamp(20px,2.6vw,32px) 0;border-top:1px solid var(--line)}
.dark .rows>div{border-color:rgba(244,241,234,.14)}
.rows h3{font-size:clamp(26px,3vw,40px);line-height:1.02}
.rows p{font-size:clamp(17px,1.35vw,19px);color:rgba(27,28,30,.82);max-width:36em}
.dark .rows p{color:rgba(244,241,234,.8)}

/* numbers */
.nums{margin-top:clamp(36px,5vw,64px);display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.nums b{display:block;font:700 clamp(44px,5.6vw,84px)/1 var(--h);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.nums span{display:block;margin-top:10px;font-size:16px;line-height:1.4;color:rgba(27,28,30,.75)}
.dark .nums span{color:rgba(244,241,234,.78)}

/* selling-style photos */
.styles{margin-top:clamp(40px,6vw,80px);display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.styles figure{border-radius:8px;overflow:hidden;position:relative;aspect-ratio:3/4;background:#000}
.styles img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.88)}
.styles figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 14px;font:700 16px/1.2 var(--h);background:linear-gradient(transparent,rgba(0,0,0,.85));color:var(--cream)}

/* CTA band */
.cta-band{background:var(--red);color:#fff;text-align:center;overflow:hidden}
.cta-band h2{max-width:14em;margin:0 auto}
.cta-band p{margin:20px auto 0;max-width:36em;font-size:clamp(17px,1.4vw,19px);color:rgba(255,255,255,.9)}
.cta-band .row{margin-top:32px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta-band svg{display:block;width:100%;height:80px;margin-top:clamp(40px,6vw,80px)}
.cta-band svg path{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:.9}

/* footer */
footer{background:var(--ink);color:var(--cream);padding:clamp(48px,6vw,80px) var(--pad)}
footer .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px;align-items:start}
footer img{height:54px;width:auto;filter:brightness(0) invert(1)}
footer h4{font:700 15px/1 var(--b);color:rgba(244,241,234,.7);margin-bottom:10px}
footer a{text-decoration:none;display:block;padding:10px 0;font-size:16px}
footer .fine{max-width:1240px;margin:36px auto 0;font-size:14px;color:rgba(244,241,234,.55)}

@media (max-width:900px){
  .two,.rows>div{grid-template-columns:1fr}
  .rows>div{gap:8px}
  .nums{grid-template-columns:1fr 1fr}
  .styles{grid-template-columns:repeat(2,1fr)}
  footer .wrap{grid-template-columns:1fr 1fr}
  .nav .logo img{height:44px}
  .nav .btn .long{display:none}
}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .ph-hero .bgimg img{animation:none}
}