:root{color-scheme:light;--paper:#f9f5ee;--sand:#e9dcc8;--deep-sand:#b49b80;--ink:#201c19;--muted:#62584e;--line:#c9bcae;--dark:#211d1a;--dark-line:#65594f}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
button{font:inherit}
button:focus-visible,a:focus-visible{outline:3px solid #9c8064;outline-offset:4px}
img,video{display:block;max-width:100%}
.eyebrow{font-size:.76rem;line-height:1.35;letter-spacing:.17em;font-weight:700;margin:0 0 1.8rem}
.masthead{height:72px;padding:0 clamp(1.2rem,5vw,5.5rem);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d8c9b8;background:#f4ebdf}
.brand{text-decoration:none;font-weight:900;letter-spacing:-.075em;font-size:1.22rem;line-height:1}
.brand-dot{color:#aa8768}
.top-contact{text-decoration:none;font-size:.91rem;font-weight:700;display:flex;gap:1.8rem;align-items:center;border-bottom:1px solid var(--ink);padding:.4rem 0}
.top-contact span{font-size:1.2rem;line-height:1}

.hero{background:radial-gradient(circle at 20% 8%,#fffaf3 0%,transparent 48%),linear-gradient(140deg,#f7efe3 0%,#e7d8c4 100%);padding:clamp(2.8rem,7vw,6.7rem) clamp(1.2rem,5vw,5.5rem) 0;overflow:hidden}
.hero-logo-window{width:100%;max-width:1340px;aspect-ratio:10.9/1;overflow:hidden;margin:0 auto clamp(3.5rem,7vw,6.2rem)}
.hero-logo-window img{width:128%;max-width:none;height:auto;transform:translate(-11%,-40%);mix-blend-mode:multiply}
.hero-lower{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(240px,.62fr);align-items:end;gap:clamp(2rem,6vw,6rem);max-width:1360px;margin:auto;padding-bottom:clamp(3rem,7vw,6rem);animation:enter .8s ease both}
.hero .eyebrow{color:#6b5949}
h1,h2,h3,p{overflow-wrap:break-word}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400}
.hero h1{font-size:clamp(3.1rem,5.8vw,6.6rem);line-height:1.04;letter-spacing:-.055em;margin:0}
.hero h1 em{font-style:italic;color:#94785f}
.hero-aside{padding-bottom:.45rem}
.hero-aside p{font-size:clamp(1.04rem,1.45vw,1.23rem);line-height:1.55;max-width:22rem;margin:0 0 2rem}
.text-link{font-size:1rem;font-weight:700;text-decoration:none;border-bottom:1px solid;padding:.25rem 0 .55rem;display:inline-flex;align-items:center;gap:3rem}
.hero-rule{max-width:1360px;margin:auto;padding:1.1rem 0;display:flex;justify-content:space-between;gap:1rem;border-top:1px solid #b4a390;font-size:.68rem;font-weight:700;letter-spacing:.13em}

.approach{padding:clamp(4.2rem,9vw,8rem) clamp(1.2rem,6vw,7rem);display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(3rem,8vw,9rem);max-width:1600px;margin:auto}
.section-intro h2,.pricing-intro h2{font-size:clamp(2.7rem,4.2vw,5rem);line-height:1.09;letter-spacing:-.045em;margin:0}
.approach-industries{font-size:1rem;line-height:1.5;color:var(--muted);max-width:26rem;margin:2.5rem 0 0}
.approach-list{border-top:1px solid var(--line)}
.approach-row{display:grid;grid-template-columns:2.1rem minmax(130px,.78fr) minmax(140px,1fr);gap:1rem;align-items:start;padding:1.34rem 0;border-bottom:1px solid var(--line)}
.approach-row>span{font-size:.8rem;color:#8e765f;font-weight:700;padding-top:.45rem}
.approach-row h3{font-size:clamp(1.3rem,1.7vw,1.8rem);letter-spacing:-.025em;margin:0}
.approach-row p{font-size:1rem;line-height:1.45;color:var(--muted);margin:.18rem 0 0}

.work{background:var(--dark);color:#f6efe6;padding:clamp(4.5rem,7vw,7rem) clamp(1.2rem,5vw,6rem) clamp(4rem,8vw,8rem)}
.work-heading{max-width:1300px;margin:0 auto clamp(3rem,5vw,5.5rem)}
.work-heading .eyebrow{color:#bba68e}
.work-heading h2{font-size:clamp(3.4rem,6.8vw,7.3rem);letter-spacing:-.055em;line-height:1.02;margin:0 0 1rem}
.work-heading>p:last-child{font-size:1.08rem;line-height:1.5;color:#c9bdb0;margin:0}
.work-grid{max-width:1300px;margin:auto;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(2rem,5vw,5.8rem);align-items:start}
.stage{position:sticky;top:1.3rem;align-self:start;background:#342c25;border:1px solid #776552;border-radius:1.2rem;padding:clamp(1.2rem,2.3vw,2.1rem);box-shadow:0 25px 70px #100d0a73;z-index:2}
.stage-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;font-size:.69rem;letter-spacing:.13em;font-weight:700;color:#dfc9af;border-bottom:1px solid #6b5b4c;padding-bottom:1rem}
.stage-head span:last-child{text-align:right}
.stage-body{display:flex;align-items:center;justify-content:center;gap:clamp(.75rem,2vw,1.6rem);padding:1.2rem 0}
.film{position:relative;flex:none;width:min(56%,34vh);aspect-ratio:9/16;border-radius:.85rem;overflow:hidden;background:#111;box-shadow:0 15px 35px #08070669}
.film video{width:100%;height:100%;object-fit:contain;background:#111}
.film-controls{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:.25rem;padding:2.8rem .65rem .65rem;background:linear-gradient(transparent,#0009)}
.film-controls button{border:1px solid #fff9;border-radius:100px;background:#1a1818c4;color:white;padding:.48rem .65rem;font-size:.77rem;line-height:1.1;cursor:pointer}
.film-controls button:hover{background:#dfd0bc;color:#191613}
.views-graphic{width:min(32%,165px);min-width:100px;margin:0;transform:rotate(3deg);background:#ede1d0;color:#29221d;border:1px solid #bfae97;padding:1rem .7rem .7rem;box-shadow:0 14px 25px #120f0c62}
.views-graphic figcaption{font-size:.66rem;font-weight:700;letter-spacing:.12em;line-height:1.35;margin-bottom:.8rem}
.views-graphic img{width:100%;height:auto;object-fit:contain;border:1px solid #9f9489;background:#4a4744}
.views-graphic span{display:block;font-size:.6rem;line-height:1.25;font-weight:700;letter-spacing:.07em;margin-top:.72rem;color:#6a5948}
.stage-open{display:flex;justify-content:space-between;border-top:1px solid #6b5b4c;padding-top:.9rem;font-size:.86rem;text-decoration:none;color:#e4c9a9}
.stage-open:hover{text-decoration:underline}
.stories{border-top:1px solid var(--dark-line)}
.story{padding:1.5rem 1.35rem 1.65rem;border-bottom:1px solid var(--dark-line);border-left:3px solid transparent;transition:background-color .4s ease,border-color .4s ease}
.story.active{background:#3a3028;border-left-color:#d4b893}
.story-top{display:flex;justify-content:space-between;gap:1rem;color:#bba68e;font-size:.72rem;letter-spacing:.12em;font-weight:700}
.story-top span:last-child{text-align:right}
.story h3{font-size:clamp(1.65rem,2.3vw,2.45rem);line-height:1.1;letter-spacing:-.03em;margin:1rem 0 .65rem}
.story p{font-size:1rem;line-height:1.52;color:#ddd1c4;max-width:35rem;margin:0 0 1.1rem}
.story-foot{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:1rem;row-gap:.25rem}
.story-foot strong{font-size:1.1rem;color:#f0d1a6}
.story-foot span{font-size:.78rem;color:#c3b5a6}
.fallback-watch{font-size:.77rem;color:#d5b996;text-decoration:none;display:inline-block;margin-top:.8rem;border-bottom:1px solid}
.fallback-watch:hover{text-decoration:underline}
.story-heart{border-left-color:#92765c}

.pricing{padding:clamp(4.5rem,8vw,8rem) clamp(1.2rem,5vw,6rem);background:#f5ede2}
.pricing-intro{max-width:1300px;margin:0 auto 2.8rem;display:grid;grid-template-columns:1fr minmax(260px,.55fr);gap:4rem;align-items:end}
.pricing-intro>p{font-size:1.06rem;line-height:1.55;color:#51483f;max-width:30rem;margin:0 0 .3rem}
.price-grid{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.price-card{min-height:215px;border:1px solid #c5b29e;border-radius:.65rem;background:#fbf8f3;padding:1.5rem 1.35rem;display:flex;flex-direction:column}
.price-card>span{font-size:.72rem;letter-spacing:.16em;color:#846950;font-weight:700}
.price-card strong{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(3.2rem,4.3vw,5.2rem);letter-spacing:-.06em;line-height:1.1;margin:1rem 0 0}
.price-card small{font-size:.88rem;color:#66584b}
.price-card p{margin:auto 0 0;font-size:1.5rem;font-weight:700;letter-spacing:-.04em}
.price-card p span{font-size:.86rem;font-weight:400;letter-spacing:0}
.price-card:last-child{background:#e6d6c0;border-color:#af9578}
.price-note{max-width:1300px;margin:1.5rem auto 0;color:#6d5f51;font-size:.79rem;line-height:1.5}

.contact{background:#dac6ad;padding:clamp(5.5rem,10vw,10rem) clamp(1.2rem,8vw,9rem);text-align:center}
.contact h2{font-size:clamp(3.4rem,7.8vw,8rem);line-height:1.02;letter-spacing:-.055em;margin:0 auto 1.25rem}
.contact>p:not(.eyebrow){font-size:1.1rem;line-height:1.55;max-width:37rem;margin:0 auto 2.2rem}
.whatsapp-button{background:var(--ink);color:#fcf5ec;border-radius:100px;padding:1rem 1.6rem;text-decoration:none;display:inline-flex;align-items:center;gap:3rem;font-size:1rem;font-weight:700;min-height:55px;transition:background .2s,transform .2s}
.whatsapp-button:hover{background:#554638;transform:translateY(-2px)}
.contact-number{display:block;font-size:.85rem;color:#5a4c40;margin-top:1.4rem}
footer{min-height:85px;background:#211d1a;color:#ead9c4;padding:1.4rem clamp(1.2rem,5vw,6rem);display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.75rem;letter-spacing:.12em}
footer span:first-child{font-weight:900;font-size:1rem;letter-spacing:-.06em}
footer a{text-decoration:none}

@keyframes enter{from{opacity:.35;transform:translateY(18px)}to{opacity:1;transform:none}}
.has-js .reveal{opacity:.35;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease,background-color .4s,border-color .4s}
.has-js .reveal.visible{opacity:1;transform:none}
@media(max-width:900px){
  .hero-lower,.approach,.pricing-intro{grid-template-columns:1fr}
  .hero-aside{max-width:32rem}
  .approach{gap:2rem}
  .pricing-intro{gap:1.5rem}
  .work-grid{grid-template-columns:1fr}
  .stage{position:sticky;top:.5rem;max-width:650px;margin:0 auto}
  .stories{max-width:650px;margin:auto}
}
@media(max-width:600px){
  .masthead{height:62px}
  .brand{font-size:1rem}
  .top-contact{font-size:.82rem;gap:.7rem}
  .hero{padding-top:3.2rem}
  .hero-logo-window{margin-bottom:3.2rem}
  .hero h1{font-size:clamp(2.7rem,10vw,4.3rem)}
  .hero-lower{padding-bottom:3rem}
  .hero-rule span:last-child{display:none}
  .approach-row{grid-template-columns:2rem 1fr;gap:.5rem .7rem}
  .approach-row p{grid-column:2;max-width:28rem;margin:0}
  .work{padding-left:0;padding-right:0}
  .work-heading{padding:0 1.2rem}
  .work-grid{display:block}
  .stage{top:0;border-radius:0;border-left:0;border-right:0;padding:1rem 1.2rem;box-shadow:0 12px 25px #100d0a88}
  .stage-body{padding:.75rem 0}
  .film{width:min(46%,22vh)}
  .views-graphic{width:min(36%,135px);min-width:95px;padding:.7rem .55rem .55rem}
  .views-graphic figcaption{font-size:.6rem;margin-bottom:.5rem}
  .views-graphic span{font-size:.53rem;margin-top:.55rem}
  .stage-open{font-size:.76rem}
  .stories{margin:0 1.2rem}
  .story{padding:1.4rem .85rem 1.5rem}
  .story h3{font-size:1.6rem}
  .price-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
  .price-card{min-height:190px;padding:1rem}
  .price-card strong{font-size:3.4rem}
  .price-card p{font-size:1.26rem}
  footer span:nth-child(2){display:none}
}
@media(max-width:355px){.hero h1{font-size:2.55rem}.views-graphic{min-width:86px}.stage-head{font-size:.6rem}.price-card>span{font-size:.65rem}.price-card p{font-size:1.15rem}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-lower{animation:none}
  .has-js .reveal{opacity:1;transform:none;transition:none}
  .whatsapp-button{transition:none}
}