:root{
  --dx:0;--dy:0;--p:0;
  --paper:#f4f5f1;
  --paper2:#e9ece6;
  --ink:#14171a;
  --graph:#1a1d21;
  --mute:#454b52;
  --line:#c3c7c0;
  --mag:#c4195f;
  --cy:#0b86a8;
  --cyt:#00657f;
  --yel:#f3c21b;
  --focus:#4a3fc7;
  --sans:"Futura","Futura PT","Century Gothic","Avenir Next","Helvetica Neue",Arial,sans-serif;
  --serif:"Baskerville","Baskerville Old Face","Hoefler Text","Times New Roman",serif;
  --mono:"Courier New","SF Mono",ui-monospace,monospace;
  --spread:calc(3deg + (var(--dx) + 1) * 3.5deg);
  --tilt:calc(var(--dy) * 4deg);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5.5rem;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:1.0625rem;line-height:1.65;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
figure{margin:0}
h1,h2,h3,p{margin:0}
a{color:inherit}
.wrap{width:min(100% - 2.5rem,1180px);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--yel);color:var(--ink);padding:.7rem 1rem;z-index:100;font-family:var(--sans);font-weight:700}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.dark :focus-visible,.site-footer :focus-visible{outline-color:var(--yel)}

/* chromatic split — pointer driven */
.split{
  --o:1;
  text-shadow:
    calc(var(--dx) * -5px * var(--o) - 1px) calc(var(--dy) * -3px * var(--o)) 0 rgba(196,25,95,.72),
    calc(var(--dx) * 5px * var(--o) + 1px) calc(var(--dy) * 3px * var(--o)) 0 rgba(11,134,168,.72);
}

/* type */
h1,h2,h3{font-family:var(--sans);font-weight:700;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,5.6vw,4.7rem);line-height:1.04;letter-spacing:-.035em}
h1 em{font-style:normal;background:linear-gradient(transparent 82%,var(--yel) 82%)}
h2{font-size:clamp(1.85rem,4vw,3.1rem);line-height:1.1;max-width:20ch}
h3{font-size:1.25rem;line-height:1.25}
.lead{font-size:1.2rem;max-width:34em;margin-top:1.4rem}
.small{font-family:var(--mono);font-size:.85rem;color:var(--mute);margin-top:1.1rem;max-width:36em}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.8rem 1.4rem;border:2px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--sans);font-weight:700;font-size:.95rem;text-decoration:none;line-height:1.2;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--mag);border-color:var(--mag);color:#fff}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn.sun{background:var(--yel);border-color:var(--yel);color:var(--ink)}
.btn.sun:hover{background:#fff;border-color:#fff;color:var(--ink)}
.more{font-family:var(--sans);font-weight:700;font-size:.95rem;text-decoration:underline;text-decoration-color:var(--mag);text-decoration-thickness:3px;text-underline-offset:4px}
.more:hover{color:var(--mag)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(244,245,241,.97);border-bottom:2px solid var(--ink)}
.bar{display:flex;align-items:center;gap:1rem;min-height:68px;flex-wrap:wrap;padding-block:.35rem}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--sans);font-weight:700;font-size:1.12rem;text-decoration:none;color:var(--ink);letter-spacing:-.01em}
.brand small{font-weight:500;font-size:.85em;color:var(--mute)}
.nav{margin-left:auto;display:flex;align-items:center;gap:1.35rem;flex-wrap:wrap}
.nav a:not(.btn){font-family:var(--sans);font-weight:600;font-size:.95rem;text-decoration:none;padding:.4rem 0;border-bottom:3px solid transparent}
.nav a:not(.btn):hover{border-bottom-color:var(--mag)}
.nav-cta{min-height:44px;padding:.55rem 1.1rem}
.nav-toggle{display:none;margin-left:auto;align-items:center;gap:.6rem;min-height:44px;padding:.4rem .9rem;background:transparent;border:2px solid var(--ink);color:var(--ink);font-family:var(--sans);font-weight:700;font-size:.95rem;cursor:pointer}
.bars,.bars::before,.bars::after{display:block;width:18px;height:2px;background:currentColor;position:relative}
.bars::before,.bars::after{content:"";position:absolute;left:0}
.bars::before{top:-6px}.bars::after{top:6px}
.meter{position:absolute;left:0;right:0;bottom:-5px;height:4px;pointer-events:none}
.meter i{display:block;height:100%;width:calc(var(--p) * 100%);background:linear-gradient(90deg,var(--mag),var(--yel),#2cc4e6,#8f7dff)}

/* gauge */
.gauge{display:none}
@media (min-width:1320px){
  .gauge{position:fixed;right:12px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;align-items:center;gap:.35rem;font-family:var(--mono);font-size:.7rem;color:var(--mute);width:48px}
  .gauge-val{font-family:var(--sans);font-weight:700;font-size:1.15rem;color:var(--ink)}
  .gauge-track{display:block;position:relative;width:3px;height:34vh;background:var(--line)}
  .gauge-track i{position:absolute;left:0;top:0;width:100%;height:calc(var(--p) * 100%);background:var(--ink)}
  .gauge-track i::after{content:"";position:absolute;left:-5px;bottom:-2px;width:13px;height:4px;background:var(--mag)}
}

/* shared */
section{position:relative}
.sec-head{margin-bottom:clamp(2rem,4vw,3.2rem)}
.sec-head>p:last-child{max-width:40em;margin-top:1.1rem}
.row-tag,.kicker{display:flex;align-items:baseline;gap:.9rem;margin-bottom:1.2rem;font-family:var(--mono);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.glyph{font-family:var(--sans);font-weight:700;letter-spacing:.14em;color:var(--ink);line-height:1;text-transform:none}
.kicker .glyph{font-size:3.4rem}
.story .glyph{font-size:2.6rem}
.services .glyph{font-size:2.1rem}
.pricing .glyph{font-size:1.7rem}
.why .glyph{font-size:1.4rem}
.process .glyph{font-size:1.15rem}
.faq .glyph{font-size:1rem}
.contact .glyph{font-size:.9rem}
.dark{background:var(--graph);color:var(--paper)}
.dark .row-tag,.dark .small{color:#b9bfc6}
.dark .glyph{color:var(--paper)}

/* hero */
.hero{padding-top:clamp(2rem,5vw,4.2rem);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding-bottom:3.5rem}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.hero-visual{position:relative}
.hero-visual>img{width:100%;aspect-ratio:4/3;object-fit:cover;border:2px solid var(--ink)}
.chart{position:absolute;left:-2.2rem;bottom:-2.6rem;width:min(78%,300px);background:#fff;border:2px solid var(--ink);padding:.9rem 1.1rem;box-shadow:8px 8px 0 var(--ink)}
.chart .row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--line);padding:.15rem 0}
.chart .row:last-child{border-bottom:0}
.chart span{font-family:var(--sans);font-weight:700;letter-spacing:.2em;line-height:1.05;--o:1.4}
.chart b{font-family:var(--mono);font-size:.78rem;color:var(--mute)}
.r1{font-size:3.9rem}.r2{font-size:2.9rem}.r3{font-size:2.1rem}.r4{font-size:1.45rem}.r5{font-size:1rem}

/* prism band */
.prism{position:relative;height:clamp(130px,17vw,200px);background:var(--graph);overflow:hidden}
.prism .beam-in{position:absolute;left:0;top:50%;width:30%;height:4px;margin-top:-2px;background:linear-gradient(90deg,transparent,#fff)}
.prism .tri{position:absolute;left:30%;top:50%;width:clamp(60px,8vw,96px);height:auto;transform:translate(-50%,-50%)}
.prism .fan{position:absolute;left:calc(30% + clamp(10px,2vw,22px));top:50%;width:0;height:0;transform:rotate(var(--tilt))}
.prism .fan i{position:absolute;left:0;top:-2px;width:90vw;height:4px;transform-origin:0 50%;transform:rotate(calc(var(--k) * var(--spread)));background:linear-gradient(90deg,var(--c),transparent 92%)}

/* story */
.story{padding:clamp(3.5rem,8vw,7rem) 0}
.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.story-photo img{width:100%;height:auto;border:2px solid var(--ink)}
.story-text h2{margin-bottom:1.4rem}
.story-text p+p{margin-top:1rem}
.pull{font-family:var(--sans);font-weight:700;font-size:clamp(1.3rem,2.4vw,1.8rem);line-height:1.2;margin:0 0 1.4rem;color:var(--ink)}
.story-text .pull+p{margin-top:0}

/* services */
.services{padding:clamp(3.5rem,8vw,7rem) 0;background:var(--paper2)}
.services-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.offer{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.8rem;padding:1.5rem 0;border-top:2px solid var(--ink)}
.offer:last-child{border-bottom:2px solid var(--ink)}
.offer .num{font-family:var(--mono);font-weight:700;color:var(--mute);padding-top:.15rem}
.offer h3{margin-bottom:.55rem}
.offer p{max-width:38em}
.foot{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 1.5rem;margin-top:.9rem!important}
.foot strong{font-family:var(--sans);font-size:1.15rem}
.photos{display:grid;gap:1.2rem}
.photos figure:first-child img{width:100%;border:2px solid var(--ink)}
.photos figure:last-child{width:84%;margin-left:auto}
.photos figure:last-child img{width:100%;border:2px solid var(--ink)}
.cta-panel{margin-top:clamp(2.5rem,5vw,4rem);background:var(--graph);color:var(--paper);padding:clamp(1.6rem,4vw,3rem);display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:.8rem 2rem;align-items:center}
.cta-panel h3{font-size:clamp(1.4rem,2.6vw,2rem);grid-column:1}
.cta-panel p{grid-column:1;max-width:40em;color:#d3d7dc}
.cta-panel .btn{grid-column:2;grid-row:1/3}

/* pricing */
.pricing{padding:clamp(3.5rem,8vw,7rem) 0;background:
  repeating-linear-gradient(0deg,transparent 0 47px,rgba(20,23,26,.07) 47px 48px),var(--paper)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;align-items:stretch}
.card{display:flex;flex-direction:column;gap:1rem;background:#fff;border:2px solid var(--ink);padding:1.8rem 1.6rem;box-shadow:7px 7px 0 var(--ink)}
.card.hot{background:var(--yel);transform:translateY(-1rem)}
.card h3{font-size:1.5rem}
.price{font-family:var(--sans);font-weight:700;font-size:clamp(1.55rem,2.6vw,2.05rem);line-height:1.1;letter-spacing:-.03em}
.card .btn{margin-top:auto;align-self:flex-start}
.card p:not(.price){flex:1 1 auto}
.card.hot .btn:hover{background:var(--mag)}
.note{margin-top:2.4rem;font-family:var(--mono);font-size:.9rem;color:var(--mute);max-width:46em}

/* why */
.why{padding:clamp(3.5rem,8vw,7rem) 0}
.why-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.why-text h2{margin-bottom:2rem}
.why-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.8rem 2rem}
.why-items>div{border-top:3px solid var(--ink);padding-top:.9rem}
.why-items h3{margin-bottom:.45rem}
.why-items>div:nth-child(2){border-top-color:var(--mag)}
.why-items>div:nth-child(3){border-top-color:var(--cy)}
.why-items>div:nth-child(4){border-top-color:var(--yel)}
.why-photo img{width:100%;border:2px solid var(--ink)}

/* process */
.process{padding:clamp(3.5rem,8vw,7rem) 0}
.process-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.process-photo{position:sticky;top:6rem}
.process-photo img{width:100%;border:2px solid var(--paper)}
.process-text h2{margin-bottom:2rem}
.step{display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:1rem;padding:1.25rem 0;border-top:1px solid #4b5159}
.step .num{font-family:var(--sans);font-weight:700;font-size:2.4rem;line-height:1;color:var(--yel)}
.step h3{margin-bottom:.35rem}
.step p{color:#d3d7dc}
.cta-inline{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem;margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid #4b5159}
.cta-inline p{max-width:24em;color:#d3d7dc}

/* faq */
.faq{padding:clamp(3.5rem,8vw,7rem) 0}
.qa-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(1.5rem,4vw,4rem)}
.qa-grid article{padding:1.4rem 0;border-top:2px solid var(--ink)}
.qa-grid h3{margin-bottom:.5rem}

/* contact */
.contact{padding:clamp(3.5rem,8vw,7rem) 0}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.contact-text h2{margin-bottom:1.4rem}
.contact-text p+p{margin-top:1rem}
.contact-text p{color:#d3d7dc;max-width:30em}
.form{display:grid;gap:1.1rem;background:var(--paper);color:var(--ink);padding:clamp(1.4rem,3vw,2.2rem);border:2px solid var(--paper);box-shadow:8px 8px 0 var(--mag)}
.field{display:grid;gap:.4rem}
.field label{font-family:var(--sans);font-weight:700;font-size:.95rem}
.field input,.field textarea{width:100%;font:inherit;font-size:1.05rem;padding:.8rem .9rem;background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:0}
.field textarea{resize:vertical;min-height:7.5rem}
.form :focus-visible{outline-color:var(--focus)}
.form .btn{justify-self:start}
.form .btn.sun{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.form .btn.sun:hover{background:var(--mag);border-color:var(--mag);color:#fff}

/* footer */
.site-footer{background:#0f1113;color:#d3d7dc;padding:2.4rem 0}
.foot-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem 3rem}
.foot-brand{font-family:var(--sans);font-weight:700;font-size:1.2rem;color:#fff;margin-bottom:.3rem}
.site-footer nav{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;align-items:flex-start}
.site-footer nav a{font-family:var(--sans);font-weight:600;color:#fff;text-decoration:underline;text-decoration-color:var(--yel);text-decoration-thickness:2px;text-underline-offset:4px;padding:.3rem 0}
.site-footer nav a:hover{color:var(--yel)}

/* responsive */
@media (max-width:1000px){
  .cards{grid-template-columns:1fr;max-width:560px}
  .card.hot{transform:none}
  .services-grid{grid-template-columns:1fr}
  .photos{grid-template-columns:1fr 1fr;align-items:start}
  .photos figure:last-child{width:100%}
  .why-grid{grid-template-columns:1fr}
  .why-photo{max-width:420px}
}
@media (max-width:900px){
  .hero-grid,.story-grid,.process-grid,.contact-grid{grid-template-columns:1fr}
  .hero-visual{margin-bottom:2.8rem}
  .chart{left:1rem;bottom:-2.4rem}
  .process-photo{position:static}
  .js .nav-toggle{display:inline-flex}
  .js .nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:.3rem 0 1rem;border-top:1px solid var(--line)}
  .js .nav.open{display:flex}
  .js .nav a:not(.btn){padding:.85rem 0;border-bottom:1px solid var(--line)}
  .js .nav .nav-cta{margin-top:.9rem}
  .nav{margin-left:0;width:100%;gap:.3rem 1.1rem}
}
@media (max-width:720px){
  .qa-grid,.why-items{grid-template-columns:1fr}
  .cta-panel{grid-template-columns:1fr}
  .cta-panel .btn{grid-column:1;grid-row:auto;justify-self:start}
  .offer{grid-template-columns:2.2rem minmax(0,1fr)}
  .step{grid-template-columns:2.6rem minmax(0,1fr)}
  .r1{font-size:3.2rem}.r2{font-size:2.4rem}.r3{font-size:1.8rem}
}
@media (max-width:420px){
  .photos{grid-template-columns:1fr}
  .actions .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* inner pages */
/* Inner pages: compact hero, closing CTA, small helpers. All new classes use the pg- prefix. */

.pg-hero{
  padding:clamp(2.2rem,5vw,4rem) 0 clamp(2.2rem,5vw,3.4rem);
  background:var(--paper);
  border-bottom:2px solid var(--ink);
}
.pg-hero .kicker .glyph{font-size:2.4rem}
.pg-hero h1{
  font-size:clamp(2.1rem,4.6vw,3.7rem);
  max-width:20ch;
  overflow-wrap:break-word;
}
.pg-hero .lead{max-width:38em}

/* intro paragraph under a why-section heading */
.why-text .pg-intro{
  margin:-.9rem 0 2rem;
  max-width:40em;
}

/* longer service rows */
.pg-offer p+p{margin-top:.7rem}

@media (min-width:1001px){
  .services-grid .photos.pg-sticky{
    position:sticky;
    top:6rem;
  }
}

/* closing call to action */
.pg-cta{padding:clamp(2.5rem,6vw,5rem) 0}
.pg-cta .cta-panel h2.pg-cta-title{
  font-size:clamp(1.4rem,2.6vw,2rem);
  max-width:none;
  grid-column:1;
}
.pg-bring{
  max-width:46em;
  margin-bottom:clamp(1.8rem,4vw,2.8rem);
}
.pg-bring h2{margin-bottom:1rem}
.pg-list{
  margin:1.2rem 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.8rem;
}
.pg-list li{
  position:relative;
  padding-left:1.5rem;
}
.pg-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:.6rem;
  height:.6rem;
  background:var(--mag);
}

@media (max-width:720px){
  .pg-hero .kicker .glyph{font-size:1.9rem}
  .pg-cta .cta-panel h2.pg-cta-title{grid-column:1}
}
@media (max-width:420px){
  .pg-hero .actions .btn{width:100%}
}

.wpf-legal { padding: clamp(3rem, 8vw, 7rem) clamp(1.25rem, 4vw, 2rem); }
.wpf-legal .wpf-legal__inner { max-width: 72ch; margin: 0 auto; }
.wpf-legal .wpf-legal__inner h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); line-height: 1.1; margin: .2em 0 .8em; }
.wpf-legal .wpf-legal__inner h2 { font-size: clamp(1.2rem, 2.2vw, 1.5rem); line-height: 1.25; margin: 2.2em 0 .6em; }
.wpf-legal .wpf-legal__inner p, .wpf-legal .wpf-legal__inner li { line-height: 1.75; max-width: none; }
.wpf-legal .wpf-legal__inner ul { padding-left: 1.2em; margin: 0 0 1em; }
.wpf-legal .wpf-legal__inner li { margin: .35em 0; list-style: disc; }
.wpf-legal .wpf-legal__inner a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
.wpf-legal .wpf-legal__meta { font-size: .875rem; opacity: .7; margin: 0; }
.wpf-legal .wpf-legal__table { overflow-x: auto; margin: 1em 0 1.5em; }
.wpf-legal table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.wpf-legal th, .wpf-legal td { text-align: left; vertical-align: top; padding: .7em .8em; border-bottom: 1px solid rgba(127,127,127,.3); }
.wpf-legal code { font-size: .85em; word-break: break-word; }
.wpf-legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.4rem; grid-column: 1 / -1;
  width: 100%; box-sizing: border-box; padding: 1.1rem clamp(1.25rem, 4vw, 2rem) 0; font-size: .875rem; }
.wpf-legal-links a { color: inherit; opacity: .85; text-decoration: underline; text-underline-offset: .15em; }
.wpf-legal-links a:hover, .wpf-legal-links a:focus-visible { opacity: 1; }

.wpf-consent { position: fixed; z-index: 99998; left: 16px; right: 16px; bottom: 16px; max-width: 27rem; box-sizing: border-box;
  padding: 20px 22px; border-radius: 14px; border: 1px solid rgba(127,127,127,.28); box-shadow: 0 14px 44px rgba(0,0,0,.24);
  font-size: 15px; line-height: 1.55; text-align: left; }
.wpf-consent[hidden] { display: none; }
.wpf-consent .wpf-consent__title { margin: 0 0 6px; font-weight: 700; font-size: 1.05em; }
.wpf-consent .wpf-consent__text { margin: 0 0 16px; max-width: none; }
.wpf-consent .wpf-consent__text a { color: inherit; text-decoration: underline; }
.wpf-consent .wpf-consent__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.wpf-consent .wpf-consent__actions button { cursor: pointer; margin: 0; width: auto; }
.wpf-consent .wpf-consent__primary, .wpf-consent .wpf-consent__secondary { font: inherit; font-weight: 600; padding: 10px 18px; border-radius: 8px; }
.wpf-consent .wpf-consent__primary { background: #1c1b19; color: #fff; border: 1px solid #1c1b19; }
.wpf-consent .wpf-consent__secondary { background: transparent; color: inherit; border: 1px solid currentColor; }
.wpf-consent button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
