﻿/* Editorial layout — original ivory, orange and natural palette. */
:root{--paper:#f3f1ec;--ink:#242724;--muted:#70736c;--orange:#e9703f;--line:#d6d6ce}
.brand .brand-name{font-size:29px;font-weight:800;letter-spacing:-1.8px;margin:0;align-self:center;line-height:.95}.brand .brand-name small{display:block;font-size:8px;font-weight:600;letter-spacing:3.3px;margin-top:7px}.brand svg{color:var(--orange);width:34px;height:36px;flex-shrink:0}
body{max-width:none}.header{height:104px;margin:0 5%;padding:0;gap:20px}.brand{font-size:23px}.header nav{font-size:12px;gap:32px}.contact-link{background:var(--ink);color:var(--paper);border:0;border-radius:40px;padding:13px 20px;font-size:11px}.contact-link span{color:var(--orange);margin-left:24px}
.landing{display:grid;grid-template-columns:1.05fr 1fr;gap:6%;padding:58px 5% 70px;align-items:center;max-width:1700px;margin:auto}.landing-copy{padding-top:20px}.eyebrow{font-size:9px;letter-spacing:1.7px}h1{font-size:clamp(55px,5.9vw,96px);letter-spacing:-.065em;font-weight:500;line-height:1.07;margin-top:30px}h1 em,h2 em,.manifesto em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.06em;color:var(--muted)}h1 .orange-dot{color:var(--orange)}.landing-description{display:flex;align-items:center;gap:25px;margin-top:32px}.landing-description p{font-size:12px;line-height:1.85;color:var(--muted)}.small-cross{color:var(--orange);font-size:47px;line-height:1}.round-link{display:inline-flex;align-items:center;gap:30px;font-size:12px;margin-top:28px}.round-arrow{display:grid;place-items:center;width:45px;height:45px;background:var(--orange);border-radius:50%;font-size:23px;transition:transform .4s,background .4s}.round-link:hover .round-arrow{transform:rotate(45deg);background:#f29264}.landing-footnote{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding-top:20px;margin-top:40px;font-size:7px;letter-spacing:1px;color:var(--muted)}
.landing-visual{position:relative;padding:0 0 38px 30px;min-width:0}.hero-media{margin:0;height:580px;min-height:0;border-radius:180px 180px 6px 6px;position:relative;overflow:hidden;background:#839188;color:white;isolation:isolate}.hero-media:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#172a2580);z-index:-1}.hero-image{z-index:-2;filter:saturate(.75);object-position:55% center;animation:landscape-in 1.6s cubic-bezier(.2,.7,.2,1) both}.visual-coordinate{position:absolute;top:40%;right:17px;writing-mode:vertical-rl;font-size:7px;letter-spacing:1.7px;color:#f3f1ecd0}.visual-caption{position:absolute;bottom:120px;left:35px;font-size:9px;line-height:1.7;letter-spacing:2px}.film-button{top:auto;bottom:32px;left:35px;transform:none;gap:12px}.film-button .play-icon{width:43px;height:43px;font-size:10px}.film-button>span:last-child{font-size:12px}.film-button small{font-size:6px;letter-spacing:1.2px}.floating-frame{position:absolute;left:-55px;top:44%;width:165px;padding:7px 7px 11px;background:var(--paper);transform:rotate(-9deg);box-shadow:0 12px 35px #20282320;transition:transform .6s;animation:frame-in 1.2s .35s both}.floating-frame:hover{transform:rotate(-2deg) translateY(-8px)}.floating-frame img{display:block;width:100%;height:155px;object-fit:cover}.floating-frame span{display:block;font-size:6px;letter-spacing:.9px;margin-top:10px;text-align:center}.visual-index{position:absolute;bottom:10px;right:0;font-size:7px;letter-spacing:1px;color:var(--muted)}
.section{padding:85px 7%}.section-label{font-size:9px;letter-spacing:1.5px}.section-label>span:last-child{font-size:8px}.manifesto{position:relative;border-block:1px solid var(--line);padding:55px 7% 65px}.manifesto p{margin-top:25px;font-family:Manrope,sans-serif;font-size:clamp(27px,3.5vw,54px);font-weight:500;line-height:1.3;letter-spacing:-1.8px}.manifesto p>span{color:var(--orange)}.manifesto-star{position:absolute;right:11%;top:40%;font-size:88px;color:var(--orange);line-height:1;transform:rotate(12deg)}h2{font-size:clamp(40px,5vw,72px);font-weight:500;letter-spacing:-3px;line-height:1.08}.section-heading>p{font-size:12px;max-width:260px}.projects-toolbar{margin:35px 0 36px}.filters{gap:7px}.filters button{font-size:10px;padding:10px 17px}.portfolio-note{font-size:7px}
.project-grid{grid-template-columns:1.18fr 1fr;column-gap:8%;row-gap:65px;align-items:start}.project-card:nth-child(even){margin-top:105px}.project-image{aspect-ratio:1.2;border-radius:5px}.project-card:nth-child(even) .project-image{aspect-ratio:.92}.project-image img{filter:saturate(.8);transition:transform 1s cubic-bezier(.2,.7,.2,1),filter .7s}.project-card:hover img{filter:saturate(1);transform:scale(1.065)}.image-tag{font-size:7px;border-radius:3px;top:18px;left:18px}.project-info{padding-top:20px;align-items:start;gap:12px}.project-info h3{font-size:clamp(19px,2vw,29px);letter-spacing:-1px}.project-info>span{font-size:7px;line-height:1.8;text-align:right;padding-top:5px}.project-grid.filtered .project-card{margin-top:0}
.expertise{background:#eaece5;border:0;margin:0 20px;border-radius:12px;padding:65px 6% 70px}.expertise-layout{display:block;margin-top:35px}.expertise-layout>div:first-child{display:grid;grid-template-columns:1.2fr 1fr;gap:12px 10%;align-items:center}.expertise h2{font-size:clamp(40px,4.6vw,65px)}.expertise .muted{font-size:12px;margin:0}.expertise .text-link{grid-column:2;justify-self:start;margin-top:-20px;font-size:11px}.service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}.service-list details{border:1px solid #ced2c8;border-radius:7px;padding:26px 22px;background:#f3f1ec88;transition:background .4s,transform .4s}.service-list details:hover{background:var(--paper);transform:translateY(-5px)}.service-list details:last-child{border:1px solid #ced2c8}.service-list summary{flex-wrap:wrap;gap:20px;align-items:center}.service-number{font-size:11px;flex-basis:100%;color:var(--orange)}.service-list h3{font-size:20px;letter-spacing:-.7px}.plus{font-size:21px}.service-list details p{margin:22px 0 28px;font-size:12px;line-height:1.9;color:#626a5b}.service-tags{margin:0;font-size:7px;letter-spacing:.8px;line-height:1.8;color:#626a5b}
.studio{grid-template-columns:.85fr 1.15fr;gap:12%;padding-top:115px;padding-bottom:115px}.studio-image{height:450px;border-radius:6px 130px 6px 6px;rotate:-3deg}.studio-image img{filter:saturate(.6)}.studio-image>span{font-size:7px}.studio-copy h2{font-size:clamp(35px,4vw,57px);margin-top:26px}.studio-copy>p{font-size:12px;max-width:460px}.studio-signature{border-top:1px solid var(--line);padding-top:25px;font-size:8px;max-width:460px}.studio-signature svg{width:32px;height:32px}
.contact{margin:0 20px;border-radius:12px;background:#252d27;padding:58px 6% 65px}.contact-layout{gap:8%;grid-template-columns:1fr 1fr}.contact h2{font-size:clamp(42px,4.5vw,65px);letter-spacing:-2.8px}.contact h2 em{color:#f29264}.contact-layout>div>p{margin-top:28px;font-size:12px}.contact form{background:#ffffff07;border:1px solid #ffffff16;border-radius:8px;padding:28px;gap:22px 20px}.contact label{font-size:10px}.contact input,.contact select,.contact textarea{font-size:12px}.submit-button{border-radius:30px;padding:15px 20px;background:#f29264}.form-note{font-size:9px}.contact>.section-label>span:last-child{font-size:8px}footer{padding:45px 5% 25px}footer>.brand{font-size:26px}.footer-bottom{padding-top:24px}
.landing-copy{animation:copy-in .9s .1s both}.landing-visual{animation:copy-in 1.1s .2s both}.js .reveal{transform:translateY(35px);transition:opacity .9s,transform .9s cubic-bezier(.2,.7,.2,1)}.js .reveal.visible{transform:translateY(0)}@keyframes copy-in{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}@keyframes landscape-in{from{scale:1.12}to{scale:1}}@keyframes frame-in{from{opacity:0;translate:0 25px;rotate:-7deg}to{opacity:1;translate:0 0;rotate:0deg}}
@media(min-width:1600px){.section{padding-left:max(7%,calc((100vw - 1450px)/2));padding-right:max(7%,calc((100vw - 1450px)/2))}.hero-media{height:660px}}
@media(max-width:1050px){.landing{gap:4%}.hero-media{height:520px}.landing-visual{padding-left:15px}.floating-frame{width:135px;left:-25px}.floating-frame img{height:130px}.landing-footnote{font-size:6px;gap:10px}h1{font-size:6.1vw}.service-list{gap:12px}.service-list details{padding:24px 16px}.service-list h3{font-size:17px}.service-list summary{gap:16px 7px}.contact form{padding:23px}.contact-layout{gap:6%}.manifesto-star{right:8%;font-size:70px}}
@media(max-width:700px){.header{height:80px;margin:0 5%;gap:10px}.brand{font-size:20px}.brand svg{width:23px}.contact-link{font-size:9px;padding:10px 13px;margin-right:0}.contact-link span{margin-left:8px;font-size:16px}.menu-toggle{font-size:20px;padding:6px}.header nav{top:79px;left:-5.6%;right:-5.6%;padding:22px 6%}.landing{grid-template-columns:1fr;padding:35px 6% 35px;gap:35px}.landing-copy{padding:0}.eyebrow{font-size:8px}h1{font-size:clamp(52px,11.5vw,78px);margin-top:24px}.landing-description{margin-top:24px;gap:22px}.landing-description p{font-size:12px}.small-cross{font-size:42px}.round-link{margin-top:22px;font-size:11px;gap:23px}.round-arrow{width:40px;height:40px}.landing-footnote{margin-top:25px;font-size:6px}.landing-visual{padding-left:30px;padding-bottom:28px;margin-left:8px}.hero-media{height:440px;border-radius:160px 160px 5px 5px;min-height:0;margin:0}.floating-frame{left:-15px;top:40%;width:132px}.floating-frame img{height:125px}.visual-index{font-size:6px;bottom:3px}.visual-caption{left:28px;bottom:105px;font-size:8px}.film-button{left:28px;bottom:25px}.section{padding:55px 6%}.manifesto{padding:40px 6% 50px}.manifesto p{font-size:clamp(25px,6vw,38px);letter-spacing:-1px;margin-top:24px}.manifesto-star{font-size:40px;top:24px;right:6%}.manifesto .section-label{font-size:7px;max-width:210px}h2{font-size:47px}.section-heading{margin-top:24px}.section-heading>p{font-size:12px;margin-top:20px}.projects-toolbar{margin:25px 0 27px}.filters{gap:6px}.filters button{padding:9px 11px;font-size:9px}.project-grid{grid-template-columns:1fr;gap:33px}.project-card:nth-child(even){margin-top:0}.project-image,.project-card:nth-child(even) .project-image{aspect-ratio:1.15}.project-info{padding-top:16px}.project-info h3{font-size:23px}.project-info>span{font-size:6px}.expertise{margin:0 10px;padding:40px 6%}.expertise-layout{margin-top:25px}.expertise-layout>div:first-child{display:block}.expertise h2{font-size:44px}.expertise .muted{margin-top:20px}.expertise .text-link{margin-top:15px}.service-list{grid-template-columns:1fr;margin-top:30px;gap:12px}.service-list details{padding:23px}.service-list summary{gap:15px}.service-number{flex-basis:auto}.service-list h3{font-size:21px}.service-list details p{margin:20px 0;font-size:12px}.studio{grid-template-columns:1fr;gap:38px;padding:70px 8%}.studio-image{height:350px;width:94%;margin:auto}.studio-copy h2{font-size:39px}.contact{margin:0 10px;padding:40px 6%}.contact-layout{grid-template-columns:1fr;gap:30px}.contact h2{font-size:44px}.contact form{padding:20px;gap:22px 13px}.contact>.section-label>span:last-child{font-size:6px;max-width:130px}.contact .section-label{font-size:7px}.contact label{min-width:0}.contact input,.contact select,.contact textarea{font-size:11px}footer{padding:32px 6% 20px}}
@media(prefers-reduced-motion:reduce){.landing-copy,.landing-visual,.hero-image,.floating-frame{animation:none}.js .reveal{opacity:1;transform:none}.service-list details:hover{transform:none}}

/* Phone and tablet refinement */
.header nav .mobile-contact{display:none}
@media(max-width:900px){
  .header{height:80px;gap:16px}
  .header nav{display:none;position:absolute;top:79px;left:0;right:0;background:var(--paper);padding:16px 20px 22px;border:1px solid var(--line);border-top:0;border-radius:0 0 18px 18px;box-shadow:0 18px 30px #24272412;flex-direction:column;gap:0}
  .header nav.open{display:flex}
  .header nav a{font-size:17px;padding:15px 4px;min-height:48px;border-bottom:1px solid var(--line)}
  .header nav .mobile-contact{display:block;color:#a34523;font-size:14px;border-bottom:0;margin-top:8px}
  .menu-toggle{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:21px;padding:0}
  .contact-link{margin-left:auto}.header .brand{flex-shrink:0}
  .contact-layout{grid-template-columns:1fr;gap:30px}.contact form{max-width:640px;width:100%}
  .service-list{grid-template-columns:1fr;gap:14px}.service-list summary{flex-wrap:nowrap;min-height:44px}.service-number{flex-basis:auto}.service-list h3{font-size:22px}.service-list details p{font-size:14px;max-width:620px}
}
@media(max-width:700px){
  html{scroll-padding-top:22px}
  .header{margin:0 20px;height:78px;justify-content:space-between}.header .contact-link{display:none}.header nav{top:77px}
  .header .brand svg{width:30px;height:32px}.brand .brand-name{font-size:28px}.brand .brand-name small{font-size:8px;letter-spacing:3px;margin-top:6px}
  .landing{padding:32px 22px 38px;gap:30px}.landing-copy{min-width:0}.eyebrow{font-size:9px;letter-spacing:1px;line-height:1.6}
  h1{font-size:clamp(43px,11.8vw,76px);line-height:1.08;letter-spacing:-.065em;margin-top:24px}
  .landing-description{gap:17px;margin-top:24px}.landing-description p{font-size:14px;line-height:1.7}.small-cross{font-size:36px;flex-shrink:0}
  .round-link{font-size:14px;min-height:48px;gap:23px;margin-top:23px}.round-arrow{height:46px;width:46px}
  .landing-footnote{margin-top:26px;padding-top:16px;font-size:8px;letter-spacing:.5px;line-height:1.5}.landing-footnote span:last-child{max-width:130px;text-align:right}
  .landing-visual{margin:0;padding:0 0 30px 25px}.hero-media{height:clamp(340px,105vw,480px);border-radius:160px 160px 8px 8px}.hero-image{object-position:54% center}
  .floating-frame{left:0;top:34%;width:clamp(104px,29vw,150px);padding:6px 6px 9px;transform:rotate(-7deg)}.floating-frame img{height:clamp(105px,29vw,145px)}.floating-frame span{font-size:7px;letter-spacing:0}
  .visual-coordinate{font-size:8px;right:14px}.visual-index{font-size:8px;letter-spacing:.3px}.visual-caption{left:24px;bottom:108px;font-size:10px;letter-spacing:1px}
  .film-button{left:20px;bottom:24px;gap:10px}.film-button .play-icon{width:48px;height:48px;flex-shrink:0}.film-button>span:last-child{font-size:14px}.film-button small{font-size:8px;letter-spacing:.6px}
  .section{padding:52px 22px}.section-label{font-size:9px;letter-spacing:.8px;gap:12px;line-height:1.6}.section-label>span:last-child{font-size:8px}
  .manifesto{padding:38px 22px 42px}.manifesto .section-label{font-size:8px;max-width:220px;padding-right:20px}.manifesto-star{font-size:31px;right:22px;top:28px}.manifesto p{font-size:clamp(23px,5.8vw,37px);letter-spacing:-.8px;line-height:1.4}
  h2,.expertise h2{font-size:clamp(36px,10.5vw,56px);letter-spacing:-2px}.section-heading>p,.expertise .muted{font-size:14px;max-width:none;line-height:1.8}
  .projects-toolbar{margin-top:24px}.filters{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px}.filters button{font-size:12px;min-height:44px;padding:10px 12px}.filters sup{font-size:9px}
  .project-grid{gap:34px}.project-image,.project-card:nth-child(even) .project-image{aspect-ratio:1.08;border-radius:9px}.image-tag{font-size:9px;letter-spacing:.5px;left:14px;top:14px;padding:8px 10px}.project-open{width:44px;height:44px;right:14px;bottom:14px}
  .project-info{display:block;padding-top:15px}.project-info h3{font-size:25px;line-height:1.2}.project-info>span{display:block;text-align:left;font-size:9px;letter-spacing:.8px;margin-top:6px;padding:0}
  .expertise{margin:0 12px;padding:36px 20px}.expertise .text-link{font-size:13px;min-height:44px}.service-list details{padding:19px 17px}.service-list summary{gap:12px}.service-list h3{font-size:20px}.service-number{font-size:11px}.service-list details p{font-size:14px;line-height:1.8;margin:17px 0 22px}.service-tags{font-size:9px;line-height:1.7;letter-spacing:.3px}
  .studio{padding:65px 25px 55px;gap:34px}.studio-image{height:clamp(290px,85vw,420px);width:94%;border-top-right-radius:100px}.studio-image>span{font-size:9px;line-height:1.5;padding:20px}.studio-copy h2{font-size:clamp(33px,8.8vw,48px);line-height:1.12}.studio-copy>p{font-size:14px;line-height:1.85}.studio-signature{font-size:10px;line-height:1.6}
  .contact{margin:0 12px;padding:34px 20px}.contact>.section-label{align-items:flex-start;flex-direction:column;gap:10px}.contact>.section-label>span:last-child{max-width:none;font-size:9px;text-align:left}.contact .section-label{font-size:9px}.contact-layout{margin-top:28px;gap:26px}.contact h2{font-size:clamp(33px,8.8vw,52px);letter-spacing:-1.7px;line-height:1.12}.contact-layout>div>p{font-size:14px;margin-top:20px}
  .contact form{grid-template-columns:minmax(0,1fr);padding:20px 16px;gap:24px;border-radius:12px}.contact label{font-size:12px;gap:8px}.contact input,.contact select,.contact textarea{font-size:16px;min-height:46px;padding:12px 0}.contact textarea{min-height:110px}.submit-button{font-size:14px;min-height:50px;align-items:center}.form-note{font-size:11px;line-height:1.7}#form-result{font-size:13px;padding:12px}
  footer{padding:32px 22px 24px;gap:24px}.back-top{font-size:11px;min-height:44px;display:flex;align-items:center;letter-spacing:0}.footer-bottom{gap:12px;padding-top:18px;font-size:9px;line-height:1.6;letter-spacing:.2px}.footer-bottom button{font-size:11px;min-height:44px;text-align:left}
  dialog{width:calc(100% - 24px);max-height:calc(100dvh - 32px);border-radius:14px}.dialog-close{width:44px;height:44px;right:12px;top:12px}.dialog-content{padding:25px 21px}.dialog-content h2{font-size:32px;letter-spacing:-1.3px;overflow-wrap:anywhere}.dialog-content p{font-size:15px}.dialog-content .text-link{font-size:13px;min-height:44px}.concept-film{height:min(440px,65dvh)}.film-text h2{font-size:clamp(32px,9vw,48px)}.film-text>span{font-size:8px;letter-spacing:1.5px}.film-text p{max-width:220px;line-height:1.6}.film-controls{padding:12px;gap:6px}.film-controls button{min-height:44px;font-size:12px}.film-controls>span{font-size:10px;line-height:1.5}
}
@media(hover:none){.project-card:hover img{transform:none;filter:saturate(.8)}.service-list details:hover{transform:none}.floating-frame:hover{transform:rotate(-7deg)}}
