@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700&display=swap');

/* Additive refinements: preserve each preset's original visual vocabulary. */
.refined { font-size:16px; }
.refined .wrap { width:min(1180px,calc(100% - 56px)); }
.refined h1 { font-size:clamp(46px,5.4vw,78px); line-height:1.04; text-wrap:balance; }
.refined h2 { font-size:clamp(34px,4vw,54px); line-height:1.08; text-wrap:balance; }
.refined h3 { line-height:1.2; }
.refined h1 em { font-style:normal; color:var(--accent); }
.refined p { max-width:65ch; }
.refined section { scroll-margin-top:24px; }
.refined .hero { min-height:660px; padding:65px 0 80px; }
.refined .hero-detail { margin:30px 0 0; font-size:12px; color:var(--muted); }
.refined .hero-detail span { padding:0 8px; }
.refined .demo-bar { font-size:10px; line-height:1.6; letter-spacing:.06em; }
.refined .demo-bar a { color:#fff; white-space:nowrap; text-decoration:underline; text-underline-offset:3px; }
.refined .button { min-height:48px; font:700 14px/1.4 var(--sans,Inter,sans-serif); cursor:pointer; }
.refined .button:focus-visible,.refined a:focus-visible,.refined button:focus-visible,.refined input:focus-visible,.refined select:focus-visible,.refined textarea:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.refined .skip-example { position:fixed; top:-100px; left:20px; z-index:100; background:var(--ink); color:var(--bg); padding:15px; }
.refined .skip-example:focus { top:10px; }
.refined .signature-head { max-width:730px; margin-bottom:38px; }
.refined .signature-head p,.refined .request-copy>p,.refined .approach-band p { color:var(--muted); }
.refined .card { display:flex; flex-direction:column; }
.refined .card h3 { margin-top:30px; }
.refined .service-action { margin-top:auto; padding-top:25px; display:block; font-weight:700; text-underline-offset:5px; }
.refined .approach-band { background:var(--surface); border-block:1px solid var(--line); }
.refined .approach-list { list-style:none; padding:0; margin:0; }
.refined .approach-list li { display:grid; grid-template-columns:40px 1fr; gap:16px; padding:22px 0; border-top:1px solid var(--line); }
.refined .approach-list li:first-child { padding-top:0; border-top:0; }
.refined .approach-list b { color:var(--accent); font:700 16px/1.5 var(--display); }
.refined .approach-list h3 { margin-bottom:8px; font-size:22px; letter-spacing:-.025em; }
.refined .approach-list p { margin:0; }
.refined .request-section { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start; }
.refined .sample-form { padding:32px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
.refined .sample-form label { display:block; margin:0 0 8px; font:700 13px/1.5 var(--sans,Inter,sans-serif); }
.refined .sample-form label span { font-weight:400; }
.refined .sample-form input,.refined .sample-form select,.refined .sample-form textarea { width:100%; min-width:0; min-height:48px; background:var(--bg); color:var(--ink); border:1px solid var(--line); padding:12px; border-radius:min(var(--radius),8px); font:400 16px/1.5 var(--sans,Inter,sans-serif); margin-bottom:22px; }
.refined .sample-form textarea { resize:vertical; }
.refined .sample-form ::placeholder { color:var(--muted); opacity:1; }
.refined .sample-form .button { width:100%; }
.refined .sample-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.refined .sample-row>div { min-width:0; }
.refined .sample-note { border-left:3px solid var(--accent); padding:2px 0 2px 18px; margin-top:35px; font-size:13px; color:var(--muted); }
.refined .sample-note p { margin:6px 0 0; }
.refined .sample-result { border-top:1px solid var(--line); margin-top:25px; padding-top:22px; font-size:14px; overflow-wrap:anywhere; }
.refined .sample-result p { margin:10px 0 0; }
.refined [hidden] { display:none!important; }
.refined .footer a { white-space:nowrap; }
.refined .mobile-nav,.refined .menu-toggle { display:none; }
.refined .assessment,.refined .cleaning-bento { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.refined .assessment article,.refined .cleaning-bento article { padding:32px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); }
.refined .assessment b,.refined .cleaning-bento b { display:block; color:var(--accent); margin-bottom:28px; }
.refined .assessment h3,.refined .cleaning-bento h3 { font-size:27px; }
.refined .assessment p,.refined .cleaning-bento p { color:var(--muted); margin-bottom:0; }

/* 01 / Bauhaus: primary blocks, rigid rules, hard offset shadows. */
.bauhaus.refined { --bg:#f0f0f0; }
.bauhaus.refined h1,.bauhaus.refined h2,.bauhaus.refined .button { text-transform:uppercase; }
.bauhaus.refined .trust { background:#f0c020; border-block:4px solid #121212; }
.bauhaus.refined .sample-form { border:3px solid #121212; box-shadow:8px 8px 0 #1040c0; }
.bauhaus.refined .sample-form input,.bauhaus.refined .sample-form select,.bauhaus.refined .sample-form textarea { border:2px solid #121212; }
/* 04 / Newsprint: a readable front page, sparse red, true monochrome imagery. */
.newsprint.refined .hero { display:grid; grid-template-columns:1.1fr .9fr; gap:48px; }
.newsprint.refined .hero>div { display:block; }
.newsprint.refined .hero h1 { font-size:clamp(58px,6.5vw,92px); border-bottom:4px solid #111; }
.newsprint.refined .hero .actions { margin-top:28px; }
.newsprint.refined .hero-image,.newsprint.refined .hero-image:hover { height:530px; filter:grayscale(1) contrast(1.08); }
.newsprint.refined .sample-form { border-top:4px solid #111; }
.newsprint.refined .sample-form label { font-family:Inter,sans-serif; }
/* 06 / Kinetic: oversized type, acid accents, controllable motion. */
.kinetic.refined .hero { min-height:720px; padding:0; }
.kinetic.refined .hero>div { width:min(1180px,calc(100% - 56px)); padding:110px 0; }
.kinetic.refined .hero h1 { font-size:clamp(60px,8vw,112px); max-width:1000px; }
.kinetic.refined .hero-image,.kinetic.refined .hero-image:hover { filter:brightness(.24) contrast(1.1); }
.kinetic.refined .hero .lead,.kinetic.refined .hero-detail { color:#dddde1; }
.kinetic.refined h2,.kinetic.refined h3,.kinetic.refined .button { text-transform:uppercase; }
.kinetic.refined .marquee { display:flex; align-items:center; gap:30px; background-image:none; animation:none; }
.kinetic.refined .marquee span { flex:1; min-width:0; overflow:hidden; }
.kinetic.refined .motion-toggle { flex:none; padding:9px 12px; border:1px solid #09090b; background:transparent; color:#09090b; font:700 12px 'Space Grotesk',sans-serif; cursor:pointer; }
.kinetic.refined .marquee span { animation:kineticShift 5s ease-in-out infinite alternate; }
@keyframes kineticShift { to { transform:translateX(18px); } }
.kinetic.refined.motion-paused .marquee span { animation-play-state:paused; }
/* 11 / Playful geometric: anchored copy with playful, bounded shapes. */
.playful.refined { --muted:#526174; --button-ink:#1e293b; }
.playful.refined .hero { grid-template-columns:1.05fr .95fr; max-width:1180px; text-align:left; gap:55px; }
.playful.refined .hero .lead { margin-inline:0; }
.playful.refined .actions { justify-content:flex-start; }
.playful.refined .hero-image { height:480px; animation:imageEnter .9s .12s both; }
.playful.refined .button:not(.alt) { background:#fbbf24; border:2px solid #1e293b; }
.playful.refined .sample-form { border:2px solid #1e293b; box-shadow:6px 6px 0 #1e293b; }
.playful.refined .approach-band { background:#ede9fe; }
/* 12 / Minimal dark: quiet amber light and precise, restrained hierarchy. */
.dark.refined .hero { display:grid; grid-template-columns:1.1fr .9fr; width:min(1180px,calc(100% - 56px)); gap:56px; overflow:visible; }
.dark.refined .hero>div { width:100%; }
.dark.refined .hero h1 { font-size:clamp(46px,5.4vw,76px); }
.dark.refined .hero-image,.dark.refined .hero-image:hover { position:static; height:530px; border:1px solid #292932; border-radius:12px; filter:brightness(.85); transform:none; }
.dark.refined .button { animation:none; }
.dark.refined .assessment article { background:linear-gradient(140deg,#1a1a24,#12121a); }
/* 13 / Clay: inflated surfaces, layered highlights, inset controls. */
.clay.refined { --muted:#635f69; --card-shadow:12px 14px 28px #c7c0d480,-8px -8px 22px #fff,inset 3px 3px 6px #fff,inset -3px -3px 7px #d6cee680; }
.clay.refined .hero { grid-template-columns:1.1fr .9fr; gap:40px; }
.clay.refined .hero>div { padding:38px; box-shadow:var(--card-shadow); }
.clay.refined .hero h1 { font-size:clamp(46px,5vw,70px); }
.clay.refined .hero-image { height:530px; border-radius:48px; }
.clay.refined .sample-form,.clay.refined .cleaning-bento article { border:0; border-radius:36px; box-shadow:var(--card-shadow); }
.clay.refined .cleaning-bento article:nth-child(2) { background:#fff0f8; }
.clay.refined .cleaning-bento article:nth-child(3) { background:#e9f6fc; }
.clay.refined .sample-form input,.clay.refined .sample-form select,.clay.refined .sample-form textarea { border:0; border-radius:20px; background:#ede8f5; box-shadow:inset 3px 3px 7px #c7c0d4,inset -3px -3px 7px #fff; }
.clay.refined .button:not(.alt) { background:linear-gradient(150deg,#7c3aed,#6022c8); box-shadow:5px 7px 14px #7c3aed33,inset 2px 2px 4px #ffffff40,inset -2px -2px 4px #42109555; border-radius:24px; }
.clay.refined .button:active { transform:scale(.97); }
/* 14 / Botanical: earthy surfaces, arches, sage and generous breathing room. */
.botanical.refined { --sans:'Source Sans 3',sans-serif; --line:#e6e2da; --muted:#566451; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.035' filter='url(%23n)'/%3E%3C/svg%3E"); }
.botanical.refined h1 em { color:#2d3a31; font-style:italic; }
.botanical.refined .button { background:#8c9a84; color:#17251b; border-radius:999px; transition:transform .5s ease; }
.botanical.refined .button.alt { background:transparent; }
.botanical.refined .hero-image { border-radius:200px 200px 24px 24px; }
.botanical.refined .eyebrow { color:#865240; }
.botanical.refined .cards .card:nth-child(2) { transform:translateY(22px); }
.botanical.refined .sample-form { background:#f0eee6; border-radius:24px; }
/* 16 / Corporate: confident type, indigo-to-violet emphasis, clean geometry. */
.corporate.refined h1 { line-height:1.1; font-weight:800; }
.corporate.refined h1 em { background:linear-gradient(120deg,#4f46e5,#7c3aed); color:transparent; background-clip:text; }
.corporate.refined .button:not(.alt) { background:linear-gradient(120deg,#4f46e5,#7c3aed); box-shadow:0 6px 16px #4f46e52b; }
.corporate.refined .hero-image { height:520px; }
.corporate.refined .sample-form { box-shadow:0 18px 50px #4f46e50c; }

@media(max-width:1000px) { .refined .nav-links { gap:10px; } .refined .nav-status { display:none; } .refined .request-section { gap:32px; } .refined .kid-path { grid-template-columns:1fr 1fr; } .refined .nav-indexed .nav-links a { min-width:0; padding:0 12px; } }
@media(max-width:800px) {
 .refined .wrap,.dark.refined .hero { width:calc(100% - 40px); }
 .refined .nav { position:relative; display:flex; min-height:72px; gap:12px; z-index:10; }
 .refined .nav .brand { font-size:21px; }
 .refined .nav .nav-links { display:none; }
 .refined .menu-toggle { display:block; border:1px solid currentColor; background:var(--surface); color:var(--ink); border-radius:var(--radius); padding:12px 14px; font:700 14px var(--sans,Inter,sans-serif); cursor:pointer; }
 .refined .mobile-nav { position:absolute; top:calc(100% + 10px); left:0; right:0; display:grid; gap:4px; padding:16px; border:1px solid var(--line); background:var(--surface); border-radius:var(--radius); box-shadow:0 12px 24px #0002; }
 .refined .mobile-nav a { padding:13px; text-decoration:none; font-weight:700; }
 .refined .hero,.playful.refined .hero,.clay.refined .hero,.botanical.refined .hero,.corporate.refined .hero,.newsprint.refined .hero,.dark.refined .hero { grid-template-columns:1fr; gap:38px; padding:46px 0 60px; min-height:0; text-align:left; }
 .refined .hero>div { min-width:0; }
 .refined .hero-image,.playful.refined .hero-image,.clay.refined .hero-image,.corporate.refined .hero-image,.newsprint.refined .hero-image,.dark.refined .hero-image { order:2; height:360px; }
 .refined h1,.clay.refined .hero h1,.dark.refined .hero h1 { font-size:clamp(43px,9vw,68px); }
 .refined section { padding:65px 0; }
 .refined .request-section,.refined .split,.refined .assessment,.refined .cleaning-bento,.refined .case-strip,.refined .menu-board { grid-template-columns:1fr; }
 .refined .menu-board article { border-right:0; border-bottom:1px solid #111; }
 .refined .signature-head { margin-bottom:28px; }
 .refined .sample-form { padding:24px; }
 .refined .sample-row { grid-template-columns:1fr; gap:0; }
 .refined .section-head { display:block; }
 .refined .trust .wrap { grid-template-columns:1fr 1fr; gap:25px; }
 .refined .stat strong { font-size:22px; }
 .refined .footer .wrap { display:grid; gap:18px; }
 .refined .footer p { margin:6px 0 0; }
 .refined .demo-bar .wrap { display:flex; align-items:center; gap:15px; }
 .refined .demo-bar span { max-width:200px; }
 .kinetic.refined .hero { min-height:630px; padding:0; }
 .kinetic.refined .hero>div { width:calc(100% - 40px); padding:65px 0; }
 .kinetic.refined .hero h1 { font-size:clamp(52px,12vw,86px); }
 .kinetic.refined .hero-image { position:absolute; height:100%; }
 .kinetic.refined .marquee { font-size:13px; }
 .clay.refined .hero>div { padding:28px; }
 .botanical.refined .cards .card:nth-child(2) { transform:none; }
}
@media(max-width:420px) { .refined .kid-path { grid-template-columns:1fr; } .refined .actions { flex-direction:column; align-items:stretch; } .refined .hero-image { height:310px; } .refined .demo-bar { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .refined .marquee span { animation:none!important; } .refined .motion-toggle { display:none; } }
/* Keep the first screen immediately readable, including inside the gallery. */
.refined .nav,.refined .hero>div>*,.refined .hero-image { animation:none; }
