@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,300;1,9..144,400&family=Manrope:wght@400;500;600;700&display=swap');

/* ===================== Tessera — editorial system ===================== */
:root{
  --navy:#0F2443; --navy2:#16385F; --cream:#F6E5D3; --cream2:#EDDBC7;
  --gold:#C9A97D; --gold2:#8C7351; --paper:#FBFAF7; --ink:#16263A;
  --muted:#5C6B7A; --line:rgba(15,36,67,.14); --lineC:rgba(246,229,211,.16);
  --maxw:1140px;
}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden;max-width:100%}

/* ---- neutralise the whole Astra shell so header & body share ONE measure ---- */
.entry-header,.ast-single-entry-banner{display:none!important}
#page,#content.site-content,
#content>.ast-container,#content .ast-container,
#primary.content-area,#primary #main.site-main,.site-main,
article.ast-article-single,.ast-article-single,
.entry-content{
  width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;
  float:none!important;display:block!important;background:none!important;border:0!important;box-shadow:none!important;
}

.tss-min{
  font-family:"Manrope",-apple-system,"Segoe UI",Arial,sans-serif;
  color:var(--ink); font-size:17px; line-height:1.7;
  width:100%; max-width:100%; margin:0; padding:0;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.tss-min *{box-sizing:border-box}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px}
.eyebrow{font-size:10.5px;letter-spacing:.30em;text-transform:uppercase;font-weight:600;color:var(--gold2);margin:0}

/* ---------------- header: real logo, merged into hero ---------------- */
.site-header,#masthead{background:var(--navy)!important;border-bottom:1px solid var(--lineC)!important;box-shadow:none!important}
.site-header .ast-primary-header-bar,.ast-primary-header-bar{background:transparent!important;min-height:78px;border:0!important}
.site-title{line-height:1;margin:0}
.site-title a{
  display:block; width:168px; height:33px; padding:0!important; overflow:hidden; text-indent:-9999px;
  background:url('/wp-content/uploads/brand/tessera-logo-cream.png') left center/contain no-repeat;
}
.site-description{display:none!important}
.main-header-menu>.menu-item>a,.ast-builder-menu .menu-link{color:rgba(246,229,211,.72)!important;font-size:11px!important;letter-spacing:.22em!important;text-transform:uppercase;font-weight:600!important;padding-left:0!important}
.main-header-menu>.menu-item>a:hover,.ast-builder-menu .menu-link:hover{color:var(--gold)!important}
.ast-builder-menu{margin-left:auto}
.site-header .ast-container,#masthead .ast-container{max-width:var(--maxw)!important;margin:0 auto!important;padding:0 40px!important;width:100%!important}
.site-header .ast-builder-grid-row{max-width:none!important;width:100%!important;padding:0!important;margin:0!important;grid-template-columns:auto 1fr!important;align-items:center;column-gap:0!important}
.site-header .ast-site-identity{padding:0!important;margin:0!important}
.site-footer,#colophon,.ast-small-footer{background:var(--navy)!important;border-top:1px solid var(--lineC)!important}
.site-footer *{background-color:transparent!important;background-image:none!important}
.ast-footer-copyright,.ast-footer-copyright p,.site-footer .ast-footer-copyright a{
  color:rgba(246,229,211,.55)!important;font-size:11px!important;letter-spacing:.14em;text-transform:uppercase;
}
.site-footer .ast-small-footer-section{padding:24px 0}

/* ---------------- HERO ---------------- */
.hero{background:var(--navy);color:var(--cream);padding:96px 0 72px;min-height:clamp(500px,72vh,680px);display:flex;align-items:center}
.hero>.wrap{width:100%}
.hero-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0 28px;align-items:end;width:100%}
.hero-main{grid-column:1/span 9}
.hero .eyebrow{color:var(--gold);margin:0 0 clamp(28px,4vw,52px)}
.hero h1{
  font-family:"Fraunces",Georgia,serif;font-weight:400;
  font-size:clamp(2.5rem,5vw,4.4rem);line-height:1.03;letter-spacing:-.022em;
  color:#FFFDFB;margin:0;max-width:20ch;
}
.hero h1 em{font-style:italic;font-weight:300;color:var(--gold)}
.hero .lede{margin:clamp(30px,3.6vw,46px) 0 0;max-width:46ch;font-size:1.04rem;line-height:1.78;color:rgba(246,229,211,.78);font-weight:400}
.hero-rail{grid-column:10/span 3;border-top:1px solid var(--lineC);padding-top:6px}
.rail-item{display:block;padding:16px 0;border-bottom:1px solid var(--lineC);text-decoration:none}
.rail-item span{display:block;font-family:"Fraunces",serif;font-weight:300;font-size:.9rem;color:var(--gold);margin-bottom:5px}
.rail-item b{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:rgba(246,229,211,.86);line-height:1.5;transition:color .2s}
.rail-item:hover b{color:var(--gold)}

/* ---------------- MANIFESTO ---------------- */
.manifesto{background:var(--paper);padding:120px 0}
.manifesto-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0 28px;margin-top:38px;align-items:start}
.manifesto .statement{grid-column:1/span 7;font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:clamp(1.55rem,2.7vw,2.1rem);line-height:1.38;letter-spacing:-.01em;color:var(--navy);margin:0}
.manifesto .statement b{font-weight:600}
.manifesto .note{grid-column:9/span 4;border-top:2px solid var(--gold);padding-top:22px;font-size:.93rem;line-height:1.82;color:var(--muted);margin:6px 0 0}

/* ---------------- CAPABILITIES (index rows) ---------------- */
.do{background:var(--cream);padding:104px 0}
.do .row{display:grid;grid-template-columns:64px minmax(0,3.3fr) minmax(0,6fr);gap:0 40px;align-items:start;padding:34px 0;border-top:1px solid var(--line)}
.do .row:last-of-type{border-bottom:1px solid var(--line)}
.do .num{font-family:"Fraunces",serif;font-weight:300;font-size:1.35rem;color:var(--gold2);line-height:1.15}
.do h3{font-family:"Fraunces",serif;font-weight:500;font-size:1.34rem;line-height:1.25;letter-spacing:-.01em;color:var(--navy);margin:0;padding-top:2px}
.do .row p{margin:0;color:#3f4f5d;font-size:.97rem;line-height:1.72;max-width:52ch}

/* ---------------- HOW (three-up) ---------------- */
.how{background:var(--paper);padding:104px 0}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:34px}
.step{padding:30px 32px 4px 0}
.step:not(:first-child){border-left:1px solid var(--line);padding-left:32px}
.step .n{display:block;font-family:"Fraunces",serif;font-weight:300;font-size:1.05rem;color:var(--gold2);margin-bottom:20px}
.step h4{font-family:"Fraunces",serif;font-weight:500;font-size:1.16rem;line-height:1.3;color:var(--navy);margin:0 0 10px}
.step p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.7;max-width:34ch}

/* ---------------- SELECTED LABELS (gallery) ---------------- */
.work{background:var(--cream);padding:104px 0}
.work .eyebrow{margin:0 0 34px}
.work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.shot{margin:0;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.shot:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(15,36,67,.4)}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{padding:15px 18px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);line-height:1.4}
.shot figcaption b{color:var(--navy);font-weight:700;margin-right:10px}

/* ---------------- CTA ---------------- */
.cta{background:var(--navy);color:var(--cream);padding:116px 0}
.cta-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0 28px;align-items:center}
.cta h2{grid-column:1/span 7;font-family:"Fraunces",serif;font-weight:400;font-size:clamp(1.95rem,3.9vw,3.15rem);line-height:1.08;letter-spacing:-.018em;color:#FFFDFB;margin:0;max-width:16ch}
.cta-side{grid-column:9/span 4}
.cta-side p{color:rgba(246,229,211,.76);font-size:.98rem;line-height:1.7;margin:0 0 26px;max-width:34ch}
.btn{display:inline-block;padding:15px 34px;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;background:var(--gold);color:var(--navy);transition:background .2s ease,transform .2s ease}
.btn:hover{background:#D8BC93;transform:translateY(-2px)}

/* ---------------- entrance ---------------- */
.fade{opacity:0;transform:translateY(16px);animation:rise .8s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.04s}.d2{animation-delay:.14s}.d3{animation-delay:.24s}.d4{animation-delay:.34s}
@keyframes rise{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.fade{animation:none;opacity:1;transform:none}}

/* ---------------- responsive ---------------- */
@media(max-width:1000px){
  .hero-grid,.manifesto-grid,.cta-grid{gap:0 24px}
  .hero-main{grid-column:1/span 12}
  .hero-rail{grid-column:1/span 12;display:grid;grid-template-columns:repeat(3,1fr);border-top:0;border-bottom:1px solid var(--lineC);margin-top:44px;padding-top:0}
  .rail-item{padding:16px 18px 16px 0;border-bottom:0;border-top:1px solid var(--lineC)}
  .rail-item + .rail-item{padding-left:18px;border-left:1px solid var(--lineC)}
  .manifesto .statement{grid-column:1/span 12}
  .manifesto .note{grid-column:1/span 12;margin-top:34px}
  .cta h2{grid-column:1/span 12}
  .cta-side{grid-column:1/span 12;margin-top:30px}
}
@media(max-width:720px){
  .wrap{padding:0 22px}
  .hero{padding:72px 0 56px;min-height:auto}
  .hero h1{font-size:clamp(2.2rem,9vw,3rem)}
  .hero .lede{font-size:1rem}
  .hero-rail{grid-template-columns:1fr;margin-top:32px}
  .rail-item{padding:14px 0}.rail-item + .rail-item{padding-left:0;border-left:0}
  .manifesto,.do,.how,.cta,.work{padding:72px 0}
  .work-grid{grid-template-columns:1fr;gap:20px}
  .do .row{grid-template-columns:1fr;gap:8px;padding:26px 0}
  .do .num{margin-bottom:2px}
  .do .row p{max-width:none}
  .steps{grid-template-columns:1fr}
  .step{padding:26px 0}
  .step:not(:first-child){border-left:0;border-top:1px solid var(--line);padding-left:0}
  .cta h2{max-width:14ch}
}