
:root{--paper:#f2efe8;--paper-light:#faf7f0;--ink:#29302e;--muted:#72756f;--line:rgba(41,48,46,.18);--cream:#fbf8f1;--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit}img{display:block;width:100%}button{font:inherit}.page-width{width:min(calc(100% - 64px),var(--max));margin:auto}.progress{position:fixed;inset:0 0 auto;z-index:100;height:2px}.progress span{display:block;width:0;height:100%;background:var(--ink)}.site-header{position:fixed;inset:0 0 auto;z-index:50;display:flex;justify-content:space-between;align-items:center;width:min(calc(100% - 64px),var(--max));margin:auto;padding:23px 0;mix-blend-mode:multiply}.brand{font-family:"Fraunces",serif;font-weight:600;text-decoration:none}.site-nav{display:flex;gap:30px}.site-nav a{font-size:.84rem;text-decoration:none}.site-nav a:hover{opacity:.55}.menu-toggle{display:none}.eyebrow{margin:0 0 24px;color:var(--muted);font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}h1,h2,h3,blockquote{font-family:"Fraunces",serif;font-weight:500;letter-spacing:-.045em}h1{max-width:1160px;margin:0;font-size:clamp(4.35rem,8.1vw,8rem);line-height:.93}h2{margin:0;font-size:clamp(3.25rem,6.35vw,6.35rem);line-height:.98}h3{margin:0;font-size:clamp(2.25rem,4.15vw,4.2rem);line-height:1}.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:145px 0 70px}.hero-bottom{display:flex;justify-content:space-between;align-items:end;gap:60px;margin-top:64px}.hero-manifesto p{margin:.35rem 0;font-size:1.05rem;font-style:italic}.hero-manifesto p:last-child{font-size:1.15rem;font-weight:600}.text-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-size:.79rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}.opening-image{height:min(90svh,950px);overflow:hidden;background:#ddd7cc}.opening-image img{height:100%;object-fit:cover;object-position:center 55%}.signature{min-height:78svh;display:flex;align-items:center;padding:150px 0;border-bottom:1px solid var(--line)}.signature h2{max-width:1240px;font-size:clamp(3.2rem,6.2vw,6.8rem);line-height:.98}.about-section{padding:165px 0;background:var(--paper-light)}.about-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:110px;align-items:center}.editorial-image{overflow:hidden;background:#ddd7cc}.editorial-image img{aspect-ratio:4/5;object-fit:cover}.about-copy h2{margin-bottom:44px;font-size:clamp(3.2rem,5.5vw,5.8rem)}.about-copy p:not(.eyebrow){max-width:710px;margin:0 0 24px;color:var(--muted);font-size:1.05rem}.stories-section{padding:150px 0 165px}.client-film{display:grid;grid-template-columns:.82fr 1.18fr;gap:110px;align-items:center;padding-bottom:115px;border-bottom:1px solid var(--line)}.client-film-copy>p:last-child{max-width:470px;margin:34px 0 0;color:var(--muted);font-size:1.04rem}.phone-film{justify-self:center;display:flex;flex-direction:column;align-items:center;gap:28px;padding:0;color:inherit;background:none;border:0;cursor:pointer}.phone-shell{position:relative;display:block;width:min(320px,58vw);aspect-ratio:9/18.9;padding:9px;background:#171918;border-radius:48px;box-shadow:0 38px 70px rgba(41,48,46,.18);transform:rotate(1.5deg);transition:.35s}.phone-screen{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#c9c1b5;border-radius:40px}.phone-screen img{width:100%;height:100%;object-fit:cover}.phone-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(18,20,19,.05),rgba(18,20,19,.27))}.phone-island{position:absolute;top:14px;left:50%;width:88px;height:25px;transform:translateX(-50%);background:#090a09;border-radius:99px}.play-mark{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:78px;height:78px;transform:translate(-50%,-50%);background:rgba(250,247,240,.9);border-radius:50%}.play-mark span{width:0;height:0;margin-left:5px;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:14px solid var(--ink)}.film-caption{display:inline-flex;align-items:center;gap:12px;padding-bottom:5px;font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--ink)}.phone-film:hover .phone-shell{transform:rotate(0) translateY(-8px)}.text-story-collage{display:grid;grid-template-columns:1.06fr .94fr;gap:34px;align-items:stretch;margin:105px 0 125px}
.text-card{position:relative;margin:0;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 18px 50px rgba(41,48,46,.09);transform:none}
.text-card img{width:100%;height:100%;object-fit:cover}
.text-card.a{grid-row:1 / span 3}
.text-card.a img{object-fit:contain;background:#fff}
.text-card.b,.text-card.c,.text-card.d{min-height:0}
.text-card.b img,.text-card.c img,.text-card.d img{object-fit:contain;background:#fff}.testimonial-heading{display:grid;grid-template-columns:.38fr 1.62fr;gap:65px;margin:110px 0 25px}.quotes figure{display:grid;grid-template-columns:1.3fr .7fr;gap:75px;align-items:end;margin:0;padding:50px 0;border-top:1px solid var(--line)}.quotes figure:last-child{border-bottom:1px solid var(--line)}.quotes blockquote{max-width:850px;margin:0;font-size:clamp(1.8rem,3vw,3.1rem);line-height:1.16}.quotes figcaption{padding-bottom:5px;color:var(--muted);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}.speaking-section{padding:165px 0;color:var(--cream);background:var(--ink)}.speaking-section .eyebrow,.speaking-section p{color:rgba(251,248,241,.68)}.speaking-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:115px;align-items:center}.speaking-copy h2{margin-bottom:42px}.speaking-copy p{max-width:650px;margin:0 0 26px;font-size:1.05rem}.topic-line{margin-top:38px;color:var(--cream);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.visual-break{height:min(72svh,760px);overflow:hidden}.visual-break img{height:100%;object-fit:cover;object-position:center 54%}.contact{padding:175px 0 120px}.contact h2{max-width:1060px}.contact-bottom{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:end;margin-top:78px}.contact-bottom p{max-width:560px;margin:0;color:var(--muted);font-size:1.06rem}.contact-bottom a{justify-self:end;padding-bottom:8px;font-size:clamp(1.15rem,2vw,1.6rem);text-decoration:none;border-bottom:1px solid var(--ink)}.site-footer{display:flex;justify-content:space-between;gap:24px;padding:30px 0 40px;color:var(--muted);font-size:.76rem;border-top:1px solid var(--line)}.site-footer a{text-decoration:none}.video-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:70px 24px 28px;visibility:hidden;opacity:0;background:rgba(20,23,22,.92);backdrop-filter:blur(16px);transition:.3s}.video-modal.open{visibility:visible;opacity:1}.video-modal-inner{width:min(430px,88vw);max-height:calc(100svh - 110px)}.video-modal video{display:block;width:100%;max-height:calc(100svh - 110px);background:#111;border-radius:28px;box-shadow:0 30px 90px rgba(0,0,0,.45)}.video-modal-close{position:absolute;top:24px;right:28px;padding:8px 0;color:var(--cream);background:none;border:0;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}body.modal-open{overflow:hidden}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}.reveal.visible{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}@media(max-width:900px){.page-width,.site-header{width:min(calc(100% - 36px),var(--max))}.site-header{mix-blend-mode:normal;padding:18px 0;background:rgba(242,239,232,.92);backdrop-filter:blur(12px)}.menu-toggle{display:block;padding:8px 0 8px 12px;background:none;border:0}.menu-toggle span{display:block;width:24px;height:1px;margin:6px 0;background:var(--ink)}.site-nav{position:absolute;top:60px;right:0;display:none;width:220px;flex-direction:column;gap:0;padding:12px 20px;background:var(--paper-light);border:1px solid var(--line)}.site-nav.open{display:flex}.site-nav a{padding:13px 0;border-bottom:1px solid var(--line)}.hero{min-height:94svh;padding-top:130px}.hero-bottom{display:block}.hero-bottom .text-link{margin-top:38px}.opening-image{height:72svh}.about-grid,.client-film,.testimonial-heading,.speaking-grid,.contact-bottom{grid-template-columns:1fr;gap:48px}.about-grid .editorial-image,.speaking-grid .editorial-image{max-width:620px}.client-film-copy{text-align:center}.text-story-collage{min-height:auto;display:grid;grid-template-columns:1fr 1fr;gap:24px}.text-card{position:static;width:auto!important;transform:none!important}.quotes figure{grid-template-columns:1fr;gap:20px}.speaking-grid .editorial-image{order:-1}.contact-bottom a{justify-self:start}.site-footer{flex-wrap:wrap}}@media(max-width:560px){h1{font-size:clamp(3.3rem,15vw,4.5rem)}h2{font-size:clamp(2.8rem,13vw,4.1rem)}.signature h2{font-size:clamp(3rem,13.5vw,4.5rem)}.opening-image{height:64svh}.text-story-collage{grid-template-columns:1fr}.quotes blockquote{font-size:1.7rem}.phone-shell{width:min(285px,76vw);border-radius:42px}.phone-screen{border-radius:35px}.site-footer{flex-direction:column;gap:8px}}


/* V8.3 testimonial layout: matches approved mock */
.stories-section {
  padding: 150px 0 165px;
}

.stories-showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(300px, .82fr);
  grid-template-areas:
    "copy phone"
    "texts phone";
  column-gap: 72px;
  row-gap: 52px;
  align-items: start;
}

.stories-showcase .client-film-copy {
  grid-area: copy;
  padding-top: 70px;
}

.stories-showcase .client-film-copy h2 {
  max-width: 690px;
}

.stories-showcase .client-film-copy > p:last-child {
  max-width: 500px;
  margin: 34px 0 0;
  color: var(--muted);
  font-size: 1.04rem;
}

.stories-showcase .phone-film {
  grid-area: phone;
  justify-self: center;
  align-self: start;
}

.stories-showcase .phone-shell {
  width: min(355px, 32vw);
}

.text-story-collage {
  grid-area: texts;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 22px;
  align-items: stretch;
  margin: 0;
  min-height: 0;
}

.text-story-stack {
  display: grid;
  grid-template-rows: repeat(3, auto);
  gap: 18px;
  align-content: start;
}

.text-card {
  position: static;
  width: auto;
  margin: 0;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 34px rgba(41,48,46,.075);
  transform: none;
}

.text-card img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  background: #fff;
}

.text-card.a {
  align-self: stretch;
}

.text-card.a img {
  height: 100%;
  object-fit: contain;
}

.quote-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 86px;
  border-top: 0;
  border-bottom: 0;
}

.quote-grid figure {
  display: flex;
  min-height: 250px;
  flex-direction: column;
  justify-content: space-between;
  gap: 34px;
  margin: 0;
  padding: 20px 42px 10px;
  border: 0;
  border-right: 1px solid var(--line);
}

.quote-grid figure:first-child {
  padding-left: 0;
}

.quote-grid figure:last-child {
  padding-right: 0;
  border-right: 0;
  border-bottom: 0;
}

.quote-grid blockquote {
  position: relative;
  max-width: none;
  margin: 0;
  padding-top: 34px;
  font-size: clamp(1.45rem, 2vw, 2.05rem);
  line-height: 1.22;
}

.quote-grid blockquote::before {
  content: "“";
  position: absolute;
  top: -4px;
  left: 0;
  font-family: "Fraunces", serif;
  font-size: 3rem;
  line-height: 1;
  color: #a98257;
}

.quote-grid figcaption {
  padding: 0;
  color: #a98257;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .stories-showcase {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "phone"
      "texts";
    row-gap: 52px;
  }

  .stories-showcase .client-film-copy {
    padding-top: 0;
    text-align: left;
  }

  .stories-showcase .phone-film {
    justify-self: center;
  }

  .stories-showcase .phone-shell {
    width: min(340px, 70vw);
  }

  .text-story-collage {
    grid-template-columns: 1fr 1fr;
  }

  .quote-grid {
    grid-template-columns: 1fr;
    margin-top: 72px;
  }

  .quote-grid figure,
  .quote-grid figure:first-child,
  .quote-grid figure:last-child {
    min-height: 0;
    padding: 38px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 560px) {
  .text-story-collage {
    grid-template-columns: 1fr;
  }

  .text-story-stack {
    gap: 16px;
  }
}
