/* FIELD & FORM — self-contained responsive sample website; no framework required */
:root{--bg:#f5f1e8;--paper:#fffdf6;--ink:#243c32;--brand:#234a3c;--accent:#d0df94;--soft:#e7ebd9;--line:#cbd1c2;--muted:#596e5d;--inverse:#faf7ee;--radius:2px;--font-head:'DM Serif Display',Georgia,serif;--font-body:'DM Sans',Arial,sans-serif}body.theme-ocean{--bg:#edf4f8;--paper:#fff;--ink:#163c50;--brand:#20536e;--accent:#efc18c;--soft:#dcecf5;--line:#c2d6dd;--muted:#526a74;--inverse:#f5fbfe}body.theme-clay{--bg:#fbf1e8;--paper:#fff9f4;--ink:#582f24;--brand:#894538;--accent:#efc4a1;--soft:#f3decf;--line:#e8cbb9;--muted:#775449;--inverse:#fff9f1}body.theme-cobalt{--bg:#f2f4ff;--paper:#fff;--ink:#212b66;--brand:#3744cf;--accent:#ebf072;--soft:#e3e8ff;--line:#cbd2fa;--muted:#646c9a;--inverse:#f9faff}body.theme-mono{--bg:#f1f0ec;--paper:#fff;--ink:#282b2a;--brand:#252827;--accent:#e4dcbe;--soft:#e3e3dd;--line:#d3d5ce;--muted:#5c6661;--inverse:#fff}body.theme-violet{--bg:#f7f2fc;--paper:#fffafe;--ink:#3c2f5b;--brand:#674e9b;--accent:#f2c0c9;--soft:#ebe0f3;--line:#dacde8;--muted:#64557c;--inverse:#fcfaff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);overflow-x:hidden}img{display:block;max-width:100%;object-fit:cover}img.image-failed{opacity:0}h1,h2,h3,p,figure{margin-top:0}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.wide-wrap{width:min(1340px,calc(100% - 10vw));margin:auto}.sample-ribbon{height:29px;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.19em;font-weight:800;font-size:9px;background:var(--ink);color:var(--inverse)}.sample-ribbon span{color:var(--accent)}.site-header{z-index:30;position:relative;background:var(--bg);border-bottom:1px solid var(--line)}.header-inner{height:98px;width:min(1340px,calc(100% - 10vw));margin:auto;display:flex;align-items:center;gap:30px}.wordmark{display:flex;align-items:center;gap:10px;white-space:nowrap}.logo-sigil{font:800 23px 'Space Grotesk',sans-serif;letter-spacing:-.15em;border:2px solid var(--ink);height:42px;width:47px;display:grid;place-content:center;padding-right:5px;line-height:1}.logo-sigil span{color:var(--brand)}.brand-word strong{display:block;font-size:19px;font-weight:800;letter-spacing:-.055em;line-height:1.1}.brand-word strong span,.footer-logo span{color:var(--brand)}.brand-word small{font-size:8px;letter-spacing:.2em;font-weight:800}.site-nav{display:flex;gap:clamp(14px,2.1vw,33px);margin-left:auto;align-items:center}.site-nav a{font-weight:700;font-size:11px;white-space:nowrap;transition:opacity .18s}.site-nav a:hover{opacity:.57}.nav-cta{white-space:nowrap;padding:14px 19px;font-size:11px;background:var(--brand);color:#fff;font-weight:800;margin-left:6px}.nav-cta span{margin-left:18px}.menu-toggle{display:none;background:transparent;border:0;width:38px;height:38px;padding:9px}.menu-toggle span{display:block;width:23px;height:2px;background:var(--ink);margin:6px 0}
/* Shared typography */
.overline,.mini-label{font-size:10px;letter-spacing:.21em;font-weight:800;text-transform:uppercase}.overline{display:flex;align-items:center;gap:12px}.section{padding:110px 0}.section-top{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:42px}.section-top h2,.approach-copy h2,.faq-layout h2,.contact-copy h2,.intro-layout h2,.statement h2{font-family:var(--font-head);font-size:clamp(43px,5.4vw,81px);font-weight:400;line-height:1.02;letter-spacing:-.03em;margin:19px 0 0}.section-top h2 em,.approach-copy h2 em,.faq-layout h2 em,.contact-copy h2 em,.statement h2 em{font-weight:400;color:var(--brand)}.section-top>p{max-width:290px;font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:5px}.main-button{border:0;display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:17px 22px;background:var(--brand);color:white;font-size:12px;font-weight:800;transition:transform .2s,background .2s}.main-button:hover{transform:translateY(-2px)}.main-button span{font-size:20px;font-weight:400}.text-link{display:inline-flex;align-items:center;gap:28px;font-size:12px;font-weight:800;border-bottom:1px solid currentColor;padding:14px 0}
/* Four entirely different hero compositions */
.hero{position:relative;overflow:hidden}.hero-inner{max-width:1340px;width:calc(100% - 10vw);margin:auto;display:grid;grid-template-columns:1fr 1fr;min-height:640px}.hero-copy{padding:85px 36px 75px 0;z-index:1}.mini-label{display:flex;gap:13px;align-items:center;color:var(--brand)}.label-line{width:25px;height:1px;background:var(--brand)}.label-number{margin-left:10px;opacity:.5}.hero h1{font:400 clamp(66px,7.7vw,124px)/.92 var(--font-head);letter-spacing:-.054em;margin:53px 0 34px}.headline-line{display:block}.hero-description{max-width:410px;font-size:16px;line-height:1.85;color:var(--muted)}.hero-actions{display:flex;align-items:center;gap:32px;margin-top:30px;flex-wrap:wrap}.hero-caption{display:flex;align-items:center;gap:17px;margin-top:72px;font-size:9px;font-weight:800;letter-spacing:.17em;line-height:1.6}.caption-symbol{font-size:34px;color:var(--brand)}.hero-visual{position:relative;padding:45px 0 50px 30px}.hero-img-frame{height:100%;min-height:555px;overflow:hidden;background:var(--soft)}.hero-photo{height:100%;width:100%}.hero-stamp{position:absolute;top:57%;left:-10px;transform:rotate(-8deg);height:144px;width:144px;background:var(--accent);color:var(--ink);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 12px 25px #0002}.hero-stamp>span{font-size:9px;font-weight:800;letter-spacing:.2em;line-height:1.5}.hero-stamp strong{font:italic 28px var(--font-head)}.hero-stamp i{font-size:13px;font-style:normal;margin-top:4px}.hero-photo-note{position:absolute;bottom:84px;right:0;background:var(--paper);padding:17px 24px;min-width:220px;border-left:4px solid var(--brand)}.hero-photo-note span{display:block;font-size:9px;font-weight:800;letter-spacing:.15em;color:var(--muted)}.hero-photo-note strong{display:block;font:400 21px var(--font-head);margin-top:6px}.hero-bottom{border-top:1px solid var(--line);min-height:54px;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;font-size:9px;letter-spacing:.17em;font-weight:800;color:var(--muted)}
/* Editorial */
.template-editorial .hero-copy{padding-right:45px}.template-editorial .hero h1{font-size:clamp(64px,6.8vw,112px)}.template-editorial .hero .line-2{font-style:italic;color:var(--brand);white-space:nowrap}.template-editorial .hero .line-3{font-size:.63em;line-height:1.22;letter-spacing:-.025em}.template-editorial .hero-img-frame{border-radius:260px 260px 3px 3px}.template-editorial .hero-visual{padding-top:42px}.template-editorial .hero-stamp{left:-55px}
/* Impact: cinematic art direction and entirely different nav & typography */
.template-impact{--font-head:'Barlow Condensed',Impact,sans-serif}.template-impact .site-header{background:var(--ink);border-color:#ffffff3b;color:#fff}.template-impact .wordmark .logo-sigil{border-color:white}.template-impact .brand-word strong span{color:var(--accent)}.template-impact .nav-cta{background:var(--accent);color:var(--ink)}.template-impact .hero{background:#1a2526;color:#fff;min-height:710px}.template-impact .hero-inner{max-width:none;width:100%;grid-template-columns:1fr;min-height:660px}.template-impact .hero-copy{padding:99px 7vw 100px;max-width:1050px;z-index:2}.template-impact .hero h1{font:900 clamp(84px,13vw,220px)/.79 var(--font-head);letter-spacing:-.025em;text-transform:uppercase;margin:48px 0 31px}.template-impact .hero .line-2{color:var(--accent)}.template-impact .hero .line-3{margin-left:15vw}.template-impact .hero-description{font-size:16px;color:#ecf1eb;max-width:330px}.template-impact .mini-label{color:var(--accent)}.template-impact .label-line{background:var(--accent)}.template-impact .hero .main-button{background:var(--accent);color:var(--ink)}.template-impact .hero .text-link{color:#fff}.template-impact .hero-visual{position:absolute;inset:0;padding:0;z-index:0}.template-impact .hero-img-frame{height:100%;min-height:0;width:100%;border:0;background:#354a44}.template-impact .hero-photo{height:100%;filter:brightness(.46) saturate(.7)}.template-impact .hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#142221c9,transparent 95%),linear-gradient(0deg,#10211fa3,transparent 60%)}.template-impact .hero-stamp{z-index:1;left:auto;right:6vw;top:auto;bottom:52px;height:172px;width:172px;transform:rotate(8deg);border-radius:0}.template-impact .hero-photo-note{display:none}.template-impact .hero-caption{margin-top:45px;color:#dbe6db}.template-impact .hero-bottom{background:var(--brand);color:#fff;border:0}.template-impact .hero .caption-symbol{color:var(--accent)}.template-impact .section-top h2,.template-impact .contact-copy h2,.template-impact .statement h2{font-weight:800;letter-spacing:-.025em;text-transform:uppercase}.template-impact .service-card{border-radius:0}.template-impact .main-button{border-radius:0}
/* Minimal: centered monumental type with gallery-style image strip */
.template-minimal{--font-head:'Space Grotesk',sans-serif}.template-minimal .header-inner{height:85px}.template-minimal .logo-sigil{border-radius:50%}.template-minimal .nav-cta{border:1px solid var(--brand);background:transparent;color:var(--ink);border-radius:100px}.template-minimal .hero{background:var(--paper)}.template-minimal .hero-inner{display:flex;flex-direction:column;min-height:initial;width:100%;max-width:none}.template-minimal .hero-copy{padding:89px 5vw 42px;text-align:center;display:flex;align-items:center;flex-direction:column}.template-minimal .hero .mini-label{justify-content:center}.template-minimal .hero h1{font:500 clamp(55px,8.5vw,140px)/1.02 var(--font-head);letter-spacing:-.078em;margin:24px 0}.template-minimal .hero .line-2{color:var(--brand)}.template-minimal .hero-description{max-width:600px;font-size:16px}.template-minimal .hero-actions{justify-content:center;margin-top:22px}.template-minimal .main-button{border-radius:50px}.template-minimal .hero-caption{display:none}.template-minimal .hero-visual{padding:15px 5vw 44px;height:450px}.template-minimal .hero-img-frame{min-height:0;height:100%;border-radius:18px}.template-minimal .hero-photo{object-position:center 56%}.template-minimal .hero-stamp{top:5px;left:auto;right:8vw;width:115px;height:115px;transform:rotate(13deg);border:6px solid var(--paper)}.template-minimal .hero-stamp strong{font-size:21px}.template-minimal .hero-photo-note{bottom:78px;right:7vw;border:0;border-radius:9px}.template-minimal .hero-bottom{border-top:0}.template-minimal .section-top h2,.template-minimal .contact-copy h2,.template-minimal .statement h2{font-family:var(--font-head);font-weight:500;letter-spacing:-.065em}.template-minimal .section{padding:120px 0}.template-minimal .service-card,.template-minimal .form-card{border-radius:16px}.template-minimal .main-button{border-radius:50px}
/* Playful: curved asymmetric visual and graphic blocks */
.template-playful{--font-head:'Space Grotesk',sans-serif;--radius:22px}.template-playful .header-inner{height:91px}.template-playful .logo-sigil{border:0;background:var(--accent);border-radius:50%;transform:rotate(-15deg)}.template-playful .nav-cta,.template-playful .main-button{border-radius:100px}.template-playful .hero{background:var(--soft)}.template-playful .hero-inner{grid-template-columns:1.05fr .95fr;min-height:630px;align-items:center}.template-playful .hero-copy{padding:80px 18px 80px 0}.template-playful .hero h1{font:700 clamp(62px,7.6vw,121px)/.93 var(--font-head);letter-spacing:-.08em;margin:49px 0 24px}.template-playful .hero .line-2{color:var(--brand);transform:rotate(-2deg);transform-origin:left}.template-playful .hero .line-3{font-size:.86em}.template-playful .hero-description{max-width:420px}.template-playful .hero-caption{margin-top:48px}.template-playful .hero-visual{padding:72px 2vw 85px 4vw;transform:rotate(3deg)}.template-playful .hero-img-frame{border-radius:48% 48% 42% 42%;min-height:520px;border:13px solid var(--paper)}.template-playful .hero-stamp{top:57px;left:auto;right:-12px;width:135px;height:135px;transform:rotate(12deg);border:7px solid var(--paper)}.template-playful .hero-photo-note{right:auto;left:1vw;bottom:75px;border:0;border-radius:18px;transform:rotate(-8deg)}.template-playful .hero-bottom{background:var(--brand);color:#fff;border:0}.template-playful .section-top h2,.template-playful .contact-copy h2{font-weight:700;letter-spacing:-.065em}.template-playful .service-card{border-radius:22px}.template-playful .service-card:nth-child(even){transform:translateY(14px)}
/* Interior sections, distinct template treatments */
.intro-band{padding:88px 0;background:var(--brand);color:var(--inverse)}.intro-layout{display:grid;grid-template-columns:220px 1fr 110px;gap:35px;align-items:start}.intro-layout .overline{margin-top:15px;color:var(--accent)}.intro-layout h2{font-size:clamp(42px,5.5vw,78px);max-width:900px;margin:0}.intro-layout .period{color:var(--accent)}.intro-layout p:not(.overline){max-width:570px;line-height:1.8;color:#ffffffc5;font-size:15px;margin:26px 0 0}.intro-symbol{font-size:110px;line-height:1;color:var(--accent);text-align:right}.services-section{background:var(--paper)}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.tier-starter .service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.service-card{position:relative;border:1px solid var(--line);padding:24px;min-height:326px;background:var(--bg);display:flex;flex-direction:column;overflow:hidden}.service-num{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px;font-size:10px;font-weight:800;color:var(--muted);letter-spacing:.1em}.service-num span{font-size:24px;color:var(--brand)}.service-main{padding:38px 0 0}.service-main h3{font:400 clamp(22px,2.4vw,34px)/1.07 var(--font-head);letter-spacing:-.015em;margin-bottom:13px}.service-main p{font-size:12px;line-height:1.8;color:var(--muted);max-width:230px}.service-photo{height:88px;width:100%;margin-top:auto;overflow:hidden;opacity:.95}.service-photo img{width:100%;height:100%;filter:saturate(.75)}.service-arrow{position:absolute;bottom:14px;right:24px;font-size:22px;background:var(--accent);border-radius:50%;width:32px;height:32px;text-align:center;line-height:30px}.section-footnote{display:flex;justify-content:space-between;padding:30px 0 0;font-size:10px;font-weight:800;letter-spacing:.12em}.section-footnote a{color:var(--brand)}.template-impact .services-section{background:var(--ink);color:var(--inverse)}.template-impact .services-section .overline,.template-impact .services-section .section-top>p{color:#b3c5ba}.template-impact .services-section .service-card{background:#ffffff0b;border:1px solid #ffffff30;color:white}.template-impact .services-section .service-num,.template-impact .services-section .service-main p{color:#b8cabf}.template-impact .services-section .service-num span{color:var(--accent)}.template-impact .services-section .service-main h3{font-size:37px;text-transform:uppercase;font-weight:800}.template-minimal .services-section{background:var(--paper)}.template-minimal .service-grid{gap:0;border-top:1px solid var(--line)}.template-minimal .service-card{border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:none;min-height:300px}.template-minimal .service-card:last-child{border-right:0}.template-minimal .service-main h3{font-weight:500}.template-playful .service-card{background:var(--soft);border:0}.template-playful .service-photo{border-radius:12px;height:105px}.template-playful .service-main h3{font-weight:700;letter-spacing:-.04em}
.starter-process{background:var(--accent);padding:60px 0}.starter-process .wide-wrap{display:flex;align-items:center;justify-content:space-between;gap:35px}.starter-process span{font-size:62px}.starter-process h2{font:400 clamp(25px,3vw,44px)/1.15 var(--font-head);flex:1;margin:0}.starter-process a{font-size:12px;font-weight:800;border-bottom:1px solid;padding:12px}.approach-section{background:var(--bg)}.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:min(8vw,115px);align-items:center}.approach-photo{min-height:600px;position:relative;background:var(--soft)}.approach-photo img{height:100%;width:100%;position:absolute;inset:0}.approach-overlay{position:absolute;bottom:18px;left:18px;right:18px;background:var(--paper);padding:18px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.1em;font-weight:800}.approach-overlay span{font-size:20px}.approach-copy .lead{font-size:15px;line-height:1.8;color:var(--muted);margin:24px 0 35px;max-width:430px}.step-list{border-top:1px solid var(--line)}.step-list>div{display:flex;gap:20px;border-bottom:1px solid var(--line);padding:19px 0}.step-list>div>span{font-size:11px;font-weight:800;color:var(--brand);width:36px}.step-list p{margin:0}.step-list strong{display:block;font-size:15px}.step-list small{font-size:12px;line-height:1.7;color:var(--muted);display:block;margin-top:5px}.template-impact .approach-photo{transform:rotate(-2deg);border:10px solid var(--paper)}.template-playful .approach-photo{border-radius:220px 220px 20px 20px;overflow:hidden}.template-minimal .approach-photo{border-radius:16px;overflow:hidden}
.projects-section{background:var(--paper)}.project-gallery{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.tier-premium .project-gallery{grid-template-columns:1.2fr .8fr;grid-template-rows:290px 290px}.project-tile{height:550px;position:relative;background:var(--soft);overflow:hidden}.tier-premium .project-tile-1{grid-row:span 2;height:598px}.tier-premium .project-tile-2,.tier-premium .project-tile-3{height:290px}.project-tile img{height:100%;width:100%;transition:transform .7s}.project-tile:hover img{transform:scale(1.05)}.project-tile figcaption{position:absolute;left:24px;bottom:24px;right:24px;background:var(--paper);padding:17px 20px;display:grid;grid-template-columns:1fr auto;gap:3px 20px}.project-tile figcaption span{font-size:9px;font-weight:800;letter-spacing:.16em;color:var(--muted)}.project-tile figcaption strong{font:400 25px var(--font-head);grid-column:1}.project-tile figcaption b{font-size:24px;grid-row:1 / span 2;grid-column:2;align-self:center;font-weight:400}.template-impact .projects-section{background:var(--bg)}.template-impact .project-tile figcaption{background:var(--ink);color:white}.template-impact .project-tile figcaption strong{font-size:34px;font-weight:800;text-transform:uppercase}.template-minimal .project-tile{border-radius:16px}.template-minimal .project-tile figcaption{border-radius:12px}.template-playful .project-tile{border-radius:18px}.template-playful .project-tile figcaption{border-radius:12px}.detailed-section{background:var(--bg)}.detail-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.detail-cards article{padding:35px 28px 29px;border:1px solid var(--line);background:var(--paper);display:flex;flex-direction:column;min-height:390px}.detail-icon{font-size:42px;color:var(--brand);height:82px}.detail-cards small{font-size:10px;letter-spacing:.14em;font-weight:800;color:var(--muted)}.detail-cards h3{font:400 34px/1.12 var(--font-head);margin:21px 0 13px}.detail-cards p{font-size:13px;line-height:1.8;color:var(--muted)}.detail-cards a{margin-top:auto;border-bottom:1px solid var(--brand);font-weight:800;font-size:11px;align-self:flex-start;padding:12px 0}.template-impact .detail-cards article{background:var(--ink);color:var(--inverse);border:0}.template-impact .detail-cards article h3{font-weight:800;text-transform:uppercase}.template-impact .detail-cards article p,.template-impact .detail-cards article small{color:#c8d3ca}.template-impact .detail-cards article a{border-color:var(--accent)}.template-playful .detail-cards article{border:0;border-radius:25px;background:var(--soft)}.template-minimal .detail-cards article{border-radius:16px}
.statement{background:var(--brand);color:white;padding:78px 0 83px}.statement-inner{display:grid;grid-template-columns:190px 1fr 120px;align-items:center;gap:25px}.statement h2{font-size:clamp(52px,7vw,108px);margin:0}.statement h2 em{color:var(--accent)}.statement-label{font-size:10px;letter-spacing:.17em;font-weight:800;color:var(--accent)}.statement-icon{font-size:100px;color:var(--accent)}.faq-section{background:var(--bg)}.faq-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}.faq-layout>div:first-child>p:last-child{margin-top:20px;color:var(--muted);line-height:1.8}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line);padding:20px 0}.faq-list summary{list-style:none;display:flex;justify-content:space-between;gap:25px;font-weight:800;font-size:15px;cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font-size:20px;font-weight:400;color:var(--brand)}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details p{margin:17px 35px 0 0;font-size:13px;line-height:1.8;color:var(--muted)}
.contact-section{background:var(--soft);padding:105px 0}.contact-layout{display:grid;grid-template-columns:1fr 1.07fr;gap:7vw;align-items:center}.contact-copy h2{font-size:clamp(72px,9vw,142px)}.contact-copy>p:not(.overline){font-size:16px;line-height:1.85;max-width:440px;color:var(--muted);margin-top:26px}.contact-small{margin-top:90px;display:flex;gap:30px;align-items:center;font-size:10px;font-weight:800;letter-spacing:.15em}.contact-small span{font-size:45px;color:var(--brand)}.form-card{background:var(--paper);padding:40px;border:1px solid var(--line);box-shadow:0 20px 45px #1329210d}.form-top{display:flex;justify-content:space-between;font-size:10px;font-weight:800;letter-spacing:.15em;color:var(--muted)}.form-top span:last-child{font-size:27px;color:var(--brand)}.form-card h3{font:400 38px/1.1 var(--font-head);margin:25px 0 9px}.form-note{font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:24px}.form-card form{display:grid;gap:15px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-card label{font-size:11px;font-weight:800;display:grid;gap:7px}.form-card input,.form-card select,.form-card textarea{display:block;min-width:0;width:100%;border:1px solid var(--line);background:var(--bg);padding:14px 12px;border-radius:0;outline:none;font-weight:500;font-size:12px;color:var(--ink)}.form-card input:focus,.form-card textarea:focus,.form-card select:focus{border-color:var(--brand)}.form-card textarea{resize:vertical}.form-card button{margin-top:3px}.sample-form-warning{font-size:9px;font-weight:800;letter-spacing:.15em;color:var(--muted);margin:15px 0 0}.template-impact .contact-section{background:var(--ink);color:var(--inverse)}.template-impact .contact-copy>p:not(.overline){color:#bdc8c1}.template-impact .contact-copy h2 em{color:var(--accent)}.template-impact .contact-small span{color:var(--accent)}.template-impact .form-card{color:var(--ink)}.template-minimal .form-card{border-radius:18px}.template-playful .form-card{border:0;border-radius:24px;transform:rotate(1deg)}
.site-footer{background:var(--ink);color:var(--inverse);padding:65px 0 22px}.footer-inner{display:flex;justify-content:space-between;gap:30px;align-items:end}.footer-logo{font:800 clamp(45px,7vw,112px)/.9 'Space Grotesk',sans-serif;letter-spacing:-.09em}.footer-logo span{color:var(--accent)}.footer-right{display:grid;gap:8px;font-size:9px;font-weight:800;letter-spacing:.16em;text-align:right;color:#c5d2c9}.footer-bottom{border-top:1px solid #ffffff37;margin-top:80px;padding-top:18px;display:flex;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:.14em;color:#bbcabd}.sample-toast{position:fixed;left:50%;bottom:25px;z-index:100;transform:translate(-50%,20px);padding:15px 20px;border-radius:8px;background:#1e392e;color:#fff;font-weight:700;font-size:13px;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 6px 24px #0004}.sample-toast.visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:1120px){.wide-wrap,.header-inner,.hero-inner{width:calc(100% - 8vw)}.site-nav{gap:14px}.hero h1{font-size:70px}.hero-caption{margin-top:45px}.intro-layout{grid-template-columns:1fr 3fr}.intro-symbol{display:none}.service-grid,.tier-starter .service-grid{grid-template-columns:repeat(2,1fr)}.approach-grid{gap:45px}.approach-photo{min-height:520px}.statement-inner{grid-template-columns:1fr 4fr}.statement-icon{display:none}.template-impact .hero h1{font-size:clamp(90px,14vw,170px)}}
@media(max-width:750px){.sample-ribbon{font-size:8px;height:25px}.header-inner{height:74px}.logo-sigil{height:37px;width:40px;font-size:19px}.brand-word strong{font-size:17px}.brand-word small{font-size:7px}.site-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:14px 6vw 20px;box-shadow:0 16px 19px #0001;border-bottom:1px solid var(--line)}.site-nav.open{display:grid;gap:0}.site-nav a{font-size:14px;color:var(--ink);padding:12px 0}.menu-toggle{display:block;margin-left:2px}.nav-cta{margin-left:auto;font-size:10px;padding:10px 13px}.nav-cta span{margin-left:10px}.wide-wrap,.header-inner,.hero-inner{width:calc(100% - 40px)}.hero-inner{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:65px 0 18px}.hero h1{font-size:clamp(58px,12vw,94px);margin:29px 0 23px}.hero-description{font-size:14px;line-height:1.7}.hero-actions{gap:24px;margin-top:25px}.hero-caption{margin-top:36px}.hero-visual{padding:25px 0 20px;height:440px}.hero-img-frame{min-height:0;height:100%}.hero-stamp{height:105px;width:105px;left:0;top:60%}.hero-stamp strong{font-size:21px}.hero-stamp>span{font-size:7px}.hero-photo-note{right:0;bottom:40px;padding:12px;min-width:180px}.hero-bottom{padding:0 20px;font-size:8px;gap:10px;line-height:1.5}.template-editorial .hero h1{font-size:clamp(54px,10.8vw,85px)}.template-editorial .hero-stamp{left:-8px}.template-impact .hero{min-height:690px}.template-impact .hero-inner{min-height:600px}.template-impact .hero-copy{padding:91px 20px 80px}.template-impact .hero h1{font-size:clamp(76px,14.4vw,115px);margin:33px 0 25px}.template-impact .hero .line-3{margin-left:0}.template-impact .hero-stamp{height:112px;width:112px;right:18px;bottom:16px}.template-impact .hero .hero-caption{margin-top:37px}.template-impact .hero-photo{object-position:60% center}.template-minimal .hero-inner{width:100%}.template-minimal .hero-copy{padding:65px 20px 25px}.template-minimal .hero h1{font-size:clamp(45px,9.5vw,82px)}.template-minimal .hero-visual{padding:0 20px 30px;height:350px}.template-minimal .hero-stamp{top:-22px;right:29px}.template-playful .hero-inner{display:flex}.template-playful .hero-copy{padding:70px 0 10px}.template-playful .hero h1{font-size:clamp(58px,11vw,89px)}.template-playful .hero-visual{padding:45px 15px 40px;height:435px}.template-playful .hero-img-frame{min-height:0}.template-playful .hero-stamp{top:0;right:-4px}.intro-band{padding:58px 0}.intro-layout{display:block}.intro-layout .overline{margin:0 0 23px}.intro-layout h2{font-size:clamp(35px,7.5vw,61px)}.intro-layout p:not(.overline){font-size:13px}.section,.template-minimal .section{padding:71px 0}.section-top{display:block;margin-bottom:30px}.section-top h2,.approach-copy h2,.faq-layout h2{font-size:clamp(39px,8vw,63px)}.section-top>p{margin:22px 0 0}.service-grid,.tier-starter .service-grid{grid-template-columns:1fr 1fr;gap:11px}.service-card{padding:17px;min-height:275px}.service-main{padding-top:25px}.service-main h3{font-size:25px}.service-main p{font-size:11px}.service-photo{height:65px}.service-arrow{right:14px;width:26px;height:26px;line-height:23px}.approach-grid,.faq-layout,.contact-layout{grid-template-columns:1fr;gap:38px}.approach-photo{min-height:400px}.step-list{margin-top:30px}.project-gallery,.tier-premium .project-gallery{grid-template-columns:1fr 1fr;grid-template-rows:auto}.project-tile,.tier-premium .project-tile-1,.tier-premium .project-tile-2,.tier-premium .project-tile-3{height:330px;grid-row:auto}.tier-premium .project-tile-3{grid-column:span 2;height:290px}.project-tile figcaption{left:10px;bottom:10px;right:10px;padding:12px}.project-tile figcaption strong{font-size:19px}.project-tile figcaption span{font-size:7px}.detail-cards{grid-template-columns:1fr;gap:12px}.detail-cards article{min-height:260px;padding:22px}.detail-icon{height:50px}.detail-cards h3{margin:14px 0}.statement{padding:55px 0}.statement-inner{display:block}.statement-label{display:block;margin-bottom:22px}.statement h2{font-size:clamp(55px,10vw,95px)}.faq-layout{gap:25px}.contact-section{padding:72px 0}.contact-copy h2{font-size:clamp(75px,13vw,110px)}.contact-small{margin-top:29px}.form-card{padding:24px}.footer-inner{display:block}.footer-logo{font-size:clamp(45px,10vw,90px)}.footer-right{text-align:left;margin-top:32px}.footer-bottom{margin-top:48px;font-size:8px;gap:25px;line-height:1.5}.starter-process .wide-wrap{display:block}.starter-process h2{margin:12px 0 30px}}
@media(max-width:420px){.nav-cta{padding:9px;font-size:9px}.brand-word strong{font-size:15px}.logo-sigil{height:34px;width:36px}.hero h1{font-size:56px}.template-editorial .hero h1{font-size:49px}.template-impact .hero h1{font-size:65px}.template-minimal .hero h1{font-size:42px}.template-playful .hero h1{font-size:57px}.hero-actions{gap:16px}.main-button{gap:10px;padding:15px}.text-link{gap:11px}.service-grid,.tier-starter .service-grid{grid-template-columns:1fr}.service-card{min-height:235px}.service-photo{height:80px}.project-gallery,.tier-premium .project-gallery{display:grid;grid-template-columns:1fr}.project-tile,.tier-premium .project-tile-1,.tier-premium .project-tile-2,.tier-premium .project-tile-3{grid-column:auto;height:330px}.form-row{grid-template-columns:1fr}.form-card h3{font-size:31px}.form-card{padding:20px}.hero-photo-note{display:none}.hero-bottom span:first-child{max-width:160px}.hero-stamp{top:67%}.footer-bottom{display:block}.footer-bottom a{display:block;margin-top:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Industry-specific visual systems: the base four templates and six palettes stay intact. */
.business-products .hero-photo{object-position:center center}
.business-products.template-impact .hero-photo{filter:brightness(.40) saturate(.82)}
.business-products .brand-word strong{letter-spacing:-.055em}
.business-products .site-nav a:hover{color:var(--brand)}
.business-products .hero-stamp{transform:rotate(9deg)}
.business-products.template-editorial .hero h1{font-size:clamp(56px,6.2vw,105px)}
.business-products.template-editorial .hero .line-2{white-space:normal}
.business-products.template-impact .hero h1{font-size:clamp(80px,12.1vw,200px)}
.business-products.template-minimal .hero h1{font-size:clamp(48px,7vw,112px)}
.business-products.template-playful .hero h1{font-size:clamp(60px,6.9vw,108px)}
/* Make the service photography a meaningful visual, not a tiny decoration. */
.service-card{overflow:hidden}
.service-photo{height:148px;margin-top:18px;position:relative;overflow:hidden;background:var(--soft)}
.service-photo img{height:100%;width:100%;object-fit:cover;transition:transform .4s}
.service-card:hover .service-photo img{transform:scale(1.035)}
.business-products .retail-catalog{background:var(--bg)}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:21px;row-gap:44px}
.tier-starter .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.tier-business .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.product-card{min-width:0}
.product-photo{display:block;height:clamp(240px,30vw,420px);position:relative;overflow:hidden;background:var(--soft)}
.product-photo img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.6,.2,1)}
.product-card:hover .product-photo img{transform:scale(1.055)}
.product-photo-action{position:absolute;left:12px;right:12px;bottom:12px;background:var(--paper);padding:13px 18px;font-size:11px;font-weight:800;letter-spacing:.025em;display:flex;align-items:center;justify-content:space-between;transform:translateY(calc(100% + 20px));transition:transform .24s}
.product-card:hover .product-photo-action,.product-photo:focus-visible .product-photo-action{transform:translateY(0)}
.product-meta{display:flex;justify-content:space-between;gap:8px;margin-top:20px;font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--brand)}
.product-meta span:last-child{color:var(--muted);font-size:9px}
.product-card h3{font:400 clamp(22px,2.5vw,34px)/1.1 var(--font-head);margin:10px 0 7px;letter-spacing:-.025em}
.product-card p{font-size:12px;line-height:1.7;color:var(--muted);max-width:30ch;margin:0 0 15px}
.product-inquiry{font-weight:800;font-size:11px;display:inline-flex;gap:15px;align-items:center;padding-bottom:5px;border-bottom:1px solid var(--brand)}
.catalog-note{margin:42px 0 0;color:var(--muted);font-size:11px;line-height:1.6}
.template-impact .product-photo{border-radius:0}
.template-impact .product-card h3{font-family:var(--font-head);font-weight:800;text-transform:uppercase;letter-spacing:0}
.template-minimal .product-photo{border-radius:14px}
.template-playful .product-photo{border-radius:30px 30px 16px 16px}
.template-playful .product-card:nth-child(even){transform:translateY(14px)}
.business-products .hero-photo-note{border-left-color:var(--accent)}
@media(max-width:1120px){.tier-business .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:750px){.business-products.template-editorial .hero h1{font-size:clamp(52px,10.2vw,82px)}.business-products.template-impact .hero h1{font-size:clamp(78px,13.5vw,112px)}.business-products.template-minimal .hero h1{font-size:clamp(43px,9vw,77px)}.business-products.template-playful .hero h1{font-size:clamp(55px,11vw,90px)}.tier-starter .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-grid,.tier-business .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 14px}.product-photo{height:260px}.product-meta{margin-top:14px}.product-card h3{font-size:23px}.product-card p{font-size:11px}.service-photo{height:115px;margin-top:14px}}
@media(max-width:420px){.business-products.template-editorial .hero h1{font-size:49px}.business-products.template-impact .hero h1{font-size:68px}.business-products.template-minimal .hero h1{font-size:40px}.business-products.template-playful .hero h1{font-size:48px}.product-grid,.tier-business .product-grid,.tier-starter .product-grid{grid-template-columns:1fr;row-gap:28px}.product-photo{height:320px}.service-photo{height:120px}.product-photo-action{transform:translateY(0)}.product-card h3{font-size:28px}}
