
:root{
  --ink:#141414;
  --muted:#66625d;
  --paper:#f5f0e8;
  --paper-2:#fffdf9;
  --line:#cfc7bd;
  --accent:#dc554f;
  --accent-dark:#b83d38;
  --dark:#161616;
  --white:#fff;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.58;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;height:auto}
button,input,textarea,select{font:inherit}
.container{width:min(var(--max),calc(100% - 52px));margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:10px;z-index:9999;background:#fff;padding:10px 14px;border:1px solid var(--ink)}
.eyebrow{
  display:inline-block;
  font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:18px
}
h1,h2,h3{
  font-family:"DM Serif Display",Georgia,serif;
  font-weight:400;
  line-height:.98;
  letter-spacing:-.025em;
  margin:0 0 20px;
}
h1{font-size:clamp(4rem,8.2vw,8.4rem)}
h2{font-size:clamp(3rem,5.5vw,5.6rem)}
h3{font-size:clamp(1.8rem,2.6vw,2.6rem)}
p{margin:0 0 18px}
.lead{font-size:clamp(1.05rem,1.5vw,1.28rem);color:#46423e;max-width:720px}
.small,.form-note{font-size:.82rem;color:var(--muted)}
.accent{color:var(--accent)}
.btn{
  min-height:48px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--ink);font-weight:800;font-size:.9rem;transition:.2s;background:transparent
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--ink);color:#fff}
.btn-primary:hover{background:var(--accent);border-color:var(--accent)}
.btn-outline{background:transparent}
.text-link{font-weight:800;border-bottom:1px solid currentColor;padding-bottom:2px}

/* Header */
.header{
  position:sticky;top:0;z-index:1000;
  background:rgba(245,240,232,.94);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nav{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{
  font-family:"DM Serif Display",Georgia,serif;
  font-size:1.65rem;letter-spacing:-.04em
}
.brand b{font-weight:400;color:var(--accent)}
.navlinks{display:flex;gap:26px;align-items:center;font-size:.84rem;font-weight:700}
.navlinks a{padding:26px 0 22px}
.navlinks a:hover{color:var(--accent)}
.navright{display:flex;gap:10px;align-items:center}
.mobile-toggle{display:none;border:0;background:transparent;font-size:1.45rem}

/* Hero: no fake dashboard; editorial asymmetry */
.hero{
  min-height:760px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.hero .container{position:relative}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  min-height:760px;
}
.hero-copy{
  padding:92px 72px 72px 0;
  border-right:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:center;
}
.hero-copy h1{max-width:900px}
.hero-copy .lead{max-width:690px;margin-top:10px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero-side{
  padding:94px 0 60px 54px;
  display:flex;flex-direction:column;justify-content:space-between;
  position:relative;
}
.hero-side:before{
  content:"";
  position:absolute;right:-150px;top:110px;width:420px;height:420px;border-radius:50%;
  border:1px solid var(--accent);opacity:.32
}
.hero-side:after{
  content:"";
  position:absolute;right:-25px;top:228px;width:170px;height:170px;border-radius:50%;
  background:var(--accent);opacity:.11
}
.hero-note{position:relative;z-index:2}
.hero-note p{font-family:"DM Serif Display";font-size:2rem;line-height:1.08;max-width:330px}
.hero-list{position:relative;z-index:2;border-top:1px solid var(--line)}
.hero-list-item{
  display:grid;grid-template-columns:40px 1fr;gap:12px;
  padding:18px 0;border-bottom:1px solid var(--line)
}
.hero-list-item span{font-size:.72rem;font-weight:800;color:var(--accent);letter-spacing:.1em}
.hero-list-item strong{font-size:.92rem}
.hero-stamp{
  display:inline-flex;align-items:center;gap:10px;margin-top:26px;
  font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em
}
.hero-stamp:before{
  content:"";width:34px;height:34px;border:1px solid var(--ink);border-radius:50%;
  background:radial-gradient(circle,var(--accent) 0 4px,transparent 5px)
}

/* Client line */
.client-line{border-bottom:1px solid var(--line);background:var(--paper-2)}
.client-line-inner{
  min-height:86px;display:grid;grid-template-columns:180px 1fr;align-items:center;gap:30px
}
.client-line-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.client-names{display:flex;gap:34px;align-items:center;overflow:hidden;flex-wrap:wrap}
.client-names span{
  font-family:"DM Serif Display";font-size:1.08rem;color:#47433f;white-space:nowrap
}

/* Editorial sections */
.section{padding:118px 0;border-bottom:1px solid var(--line)}
.section-paper{background:var(--paper-2)}
.section-dark{background:var(--dark);color:#fff;border-color:#333}
.section-dark .lead,.section-dark p{color:#d6d0c9}
.section-title-grid{
  display:grid;grid-template-columns:280px 1fr;gap:54px;align-items:start;margin-bottom:68px
}
.section-kicker{
  font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);
  padding-top:12px
}
.section-dark .section-kicker{color:#aaa}
.section-title-grid h2{max-width:920px}

/* Problems: no cards */
.problem-list{border-top:1px solid var(--line)}
.problem-row{
  display:grid;grid-template-columns:80px minmax(0,1fr) minmax(260px,.48fr);
  gap:28px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)
}
.problem-row .num{font-size:.72rem;font-weight:800;letter-spacing:.12em;color:var(--accent)}
.problem-row h3{font-size:clamp(2rem,3.2vw,3.4rem);margin:0}
.problem-row p{color:var(--muted);margin:0}
.problem-row:hover h3{color:var(--accent)}

/* Services as indexed editorial rows */
.service-index{border-top:1px solid var(--ink)}
.service-row{
  display:grid;grid-template-columns:74px 280px 1fr auto;
  gap:28px;align-items:center;
  padding:26px 0;border-bottom:1px solid var(--line);
  transition:.2s
}
.service-row:hover{padding-left:14px;background:rgba(255,255,255,.34)}
.service-no{font-size:.72rem;font-weight:800;letter-spacing:.12em;color:var(--accent)}
.service-row h3{font-size:2rem;margin:0}
.service-scene{font-size:1rem;color:#4c4844;margin:0;max-width:620px}
.service-row .arrow{font-size:1.6rem}

/* Work: magazine composition */
.work-grid{
  display:grid;grid-template-columns:1.15fr .85fr;gap:18px
}
.work-main{
  min-height:560px;background:var(--ink);color:#fff;padding:48px;
  display:flex;flex-direction:column;justify-content:space-between
}
.work-main h3{font-size:4rem;max-width:660px}
.work-main .work-meta{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #4c4c4c;padding-top:22px}
.work-stack{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.work-mini{
  min-height:271px;padding:34px;background:var(--paper-2);border:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:space-between
}
.work-mini h3{font-size:2.3rem}
.work-mini.accent-block{background:var(--accent);color:#fff;border-color:var(--accent)}
.work-mini.accent-block p{color:#fff}

/* GEO statement */
.geo-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:80px;align-items:start}
.geo-big{
  font-family:"DM Serif Display";font-size:clamp(4rem,7vw,7.4rem);line-height:.9;color:var(--accent);
  position:sticky;top:130px
}
.geo-points{border-top:1px solid #494949}
.geo-point{padding:30px 0;border-bottom:1px solid #494949}
.geo-point span{font-size:.72rem;font-weight:800;color:#e68782;letter-spacing:.12em}
.geo-point h3{font-size:2.2rem;margin-top:10px}

/* Process vertical */
.process{display:grid;grid-template-columns:290px 1fr;gap:60px}
.process-intro{position:sticky;top:120px;align-self:start}
.process-list{border-top:1px solid var(--line)}
.process-step{
  display:grid;grid-template-columns:70px 1fr;gap:28px;padding:34px 0;border-bottom:1px solid var(--line)
}
.process-step span{font-size:.72rem;font-weight:800;color:var(--accent);letter-spacing:.12em}
.process-step h3{font-size:2.35rem;margin-bottom:9px}
.process-step p{color:var(--muted)}

/* About */
.about-split{
  display:grid;grid-template-columns:.72fr 1.28fr;gap:0;border:1px solid var(--ink)
}
.about-mark{
  min-height:520px;background:var(--accent);display:flex;align-items:flex-end;padding:36px;color:#fff;
  position:relative;overflow:hidden
}
.about-mark:before{
  content:"M";position:absolute;right:-22px;top:-42px;
  font-family:"DM Serif Display";font-size:28rem;line-height:1;color:rgba(255,255,255,.13)
}
.about-mark strong{font-family:"DM Serif Display";font-size:3rem;line-height:1}
.about-copy{background:var(--paper-2);padding:54px}
.about-copy h2{font-size:4rem}
.about-copy .signature{border-top:1px solid var(--line);padding-top:22px;margin-top:30px}

/* Testimonials: pullquotes */
.testimonial-list{border-top:1px solid var(--line)}
.testimonial{
  display:grid;grid-template-columns:240px 1fr;gap:54px;padding:42px 0;border-bottom:1px solid var(--line)
}
.testimonial cite{font-style:normal;font-size:.84rem;color:var(--muted)}
.testimonial blockquote{
  margin:0;font-family:"DM Serif Display";font-size:clamp(2rem,3vw,3.4rem);line-height:1.08
}

/* Articles */
.article-list{border-top:1px solid var(--ink)}
.article-row{
  display:grid;grid-template-columns:170px 1fr auto;gap:30px;align-items:center;
  padding:22px 0;border-bottom:1px solid var(--line)
}
.article-row span{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-weight:800}
.article-row h3{font-family:"Manrope";font-size:1rem;font-weight:800;margin:0;letter-spacing:0;line-height:1.35}
.article-row:hover h3{color:var(--accent)}

/* Form block */
.cta-editorial{
  display:grid;grid-template-columns:.8fr 1.2fr;border:1px solid var(--ink);
  background:var(--paper-2)
}
.cta-copy{background:var(--ink);color:#fff;padding:54px}
.cta-copy h2{font-size:4.3rem}
.cta-copy p{color:#d6d0ca}
.form-card{padding:48px;background:var(--paper-2)}
.form-card h3{font-size:2.2rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
label{font-size:.78rem;font-weight:800}
input,textarea,select{
  width:100%;border:0;border-bottom:1px solid #9f9992;background:transparent;
  border-radius:0;padding:12px 2px;color:var(--ink)
}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent)}
textarea{min-height:120px;resize:vertical}
.form-success,.form-error{display:none;padding:12px 0;font-weight:700}
.form-success{color:#2f6f55}.form-error{color:#a22f2b}

/* Footer */
.footer{background:#101010;color:#fff;padding:70px 0 24px}
.footer-top{
  display:grid;grid-template-columns:1.3fr .7fr;gap:70px;padding-bottom:56px;border-bottom:1px solid #333;margin-bottom:44px
}
.footer-top h2{font-size:4.6rem;max-width:750px}
.footer-top p{color:#bbb;max-width:470px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:42px}
.footer h3{font-family:"Manrope";font-size:.8rem;text-transform:uppercase;letter-spacing:.11em}
.footer p,.footer a{color:#bbb;font-size:.88rem}
.footer a:hover{color:#fff}
.footer-bottom{border-top:1px solid #333;margin-top:40px;padding-top:18px;color:#777;font-size:.78rem}
.wa{
  position:fixed;right:18px;bottom:18px;width:52px;height:52px;border-radius:50%;
  background:#111;color:#fff;border:1px solid #444;display:grid;place-items:center;font-size:.72rem;font-weight:800;z-index:900
}

/* Generic subpages, also de-template them */
.page-hero{padding:92px 0 70px;border-bottom:1px solid var(--line);background:var(--paper)}
.page-hero .container{max-width:1100px}
.page-hero h1{font-size:clamp(4rem,7vw,7rem)}
.breadcrumbs{padding-top:22px;font-size:.78rem;color:var(--muted)}
.card{
  background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;
  box-shadow:none;padding:26px 0
}
.card:hover{transform:none;box-shadow:none}
.grid{display:grid;gap:28px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.quote-card{min-height:0}
.section-head{max-width:920px;margin-bottom:50px}
.section-head.center{text-align:left;margin-inline:0}
.trust-strip,.proof-bar{display:none!important}

/* article pages */
.article-hero{padding:80px 0 46px;border-bottom:1px solid var(--line)}
.article-wrap{width:min(840px,calc(100% - 48px));margin:auto}
.article-wrap h1{font-size:clamp(3.8rem,7vw,6.8rem)}
.article-body{padding:42px 0 90px}
.article-body h2{font-size:clamp(2.6rem,4.6vw,4.5rem);margin-top:64px}
.article-body h3{font-size:2rem;margin-top:36px}
.article-callout{border-left:4px solid var(--accent);padding:22px 26px;background:var(--paper-2);margin:34px 0}
.article-cta{margin-top:64px;padding:36px;background:var(--dark);color:#fff}
.reading-meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:.82rem}

@media(max-width:1020px){
  .navlinks{display:none}.mobile-toggle{display:block}
  .hero-grid{grid-template-columns:1fr;min-height:auto}
  .hero-copy{border-right:0;padding-right:0;padding-bottom:52px}
  .hero-side{border-top:1px solid var(--line);padding:46px 0 54px}
  .section-title-grid,.geo-grid,.process,.about-split,.cta-editorial,.work-grid,.footer-top{grid-template-columns:1fr}
  .geo-big,.process-intro{position:static}
  .problem-row{grid-template-columns:60px 1fr}.problem-row p{grid-column:2}
  .service-row{grid-template-columns:60px 220px 1fr}.service-row .arrow{display:none}
  .work-main{min-height:420px}
  .client-line-inner{grid-template-columns:1fr;padding:20px 0}
  .testimonial{grid-template-columns:1fr;gap:14px}
}
@media(max-width:680px){
  .container{width:min(100% - 28px,var(--max))}
  .nav{min-height:66px}.navright .btn{display:none}
  h1{font-size:clamp(3.25rem,16vw,5rem)}
  h2{font-size:clamp(2.7rem,12vw,4.2rem)}
  .hero{min-height:auto}.hero-grid{min-height:auto}
  .hero-copy{padding-top:56px}
  .hero-side{padding-top:36px}
  .client-names{gap:14px 24px}
  .section{padding:78px 0}
  .section-title-grid{gap:18px;margin-bottom:44px}
  .problem-row{grid-template-columns:42px 1fr;gap:16px}
  .problem-row h3{font-size:2.25rem}
  .service-row{grid-template-columns:42px 1fr;padding:22px 0}
  .service-row h3{font-size:1.8rem}
  .service-scene{grid-column:2}
  .work-main{padding:30px}.work-main h3{font-size:3rem}
  .work-stack{grid-template-rows:auto}.work-mini{min-height:220px}
  .about-mark{min-height:260px}
  .about-copy{padding:30px 24px}.about-copy h2{font-size:3rem}
  .testimonial blockquote{font-size:2.25rem}
  .article-row{grid-template-columns:1fr auto}.article-row span{grid-column:1/-1}
  .form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}
  .cta-copy,.form-card{padding:30px 24px}.cta-copy h2{font-size:3.25rem}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-top h2{font-size:3.5rem}
}
