    :root,[data-theme="light"]{
      --text-xs:clamp(.75rem,.7rem + .25vw,.875rem);
      --text-sm:clamp(.875rem,.8rem + .35vw,1rem);
      --text-base:clamp(1rem,.95rem + .25vw,1.125rem);
      --text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);
      --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
      --text-2xl:clamp(2rem,1.2rem + 2.5vw,3.5rem);
      --text-3xl:clamp(2.5rem,1rem + 4vw,5rem);
      --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;
      --color-bg:#f7f6f2;--color-surface:#fbfbf8;--color-surface-2:#f0eee9;--color-surface-3:#e8e4db;--color-border:#d8d3ca;
      --color-text:#1f1d19;--color-text-muted:#67635b;--color-text-faint:#969188;--color-text-inverse:#faf8f4;
      --color-primary:#0f6b72;--color-primary-hover:#0a5056;--color-primary-soft:#dcebea;--color-primary-line:#7da9ac;
      --color-success:#3f7f2d;--color-warning:#9b5618;
      --shadow-sm:0 1px 2px rgba(24,24,24,.06);--shadow-md:0 10px 30px rgba(24,24,24,.08);--shadow-lg:0 20px 50px rgba(24,24,24,.12);
      --radius-sm:.4rem;--radius-md:.75rem;--radius-lg:1rem;--radius-xl:1.5rem;--radius-full:999px;
      --font-display:'Playfair Display',Georgia,serif;--font-body:'Source Sans 3',system-ui,sans-serif;
      --content:1200px;
    }
    [data-theme="dark"]{
      --color-bg:#151513;--color-surface:#1b1b18;--color-surface-2:#23221f;--color-surface-3:#2b2925;--color-border:#393732;
      --color-text:#ece8df;--color-text-muted:#b8b3aa;--color-text-faint:#908a82;--color-text-inverse:#171613;
      --color-primary:#62b9bf;--color-primary-hover:#8ad1d6;--color-primary-soft:#1f3334;--color-primary-line:#44767b;
      --color-success:#84c86d;--color-warning:#f0a661;
      --shadow-sm:0 1px 2px rgba(0,0,0,.3);--shadow-md:0 10px 30px rgba(0,0,0,.35);--shadow-lg:0 20px 50px rgba(0,0,0,.45);
    }
    *,:before,:after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;background:radial-gradient(1200px 500px at 85% -120px,color-mix(in srgb,var(--color-primary) 8%, transparent),transparent 65%),radial-gradient(900px 420px at -10% 16%,color-mix(in srgb,var(--color-primary) 6%, transparent),transparent 70%),var(--color-bg);color:var(--color-text)}
    img,svg{display:block;max-width:100%;height:auto}
    a{text-decoration:none;color:inherit}
    button,input,textarea{font:inherit}
    .container{width:min(calc(100% - 2rem),var(--content));margin:0 auto}
    .skip-link{position:absolute;left:-9999px;top:auto}.skip-link:focus{left:1rem;top:1rem;z-index:1000;background:var(--color-primary);color:var(--color-text-inverse);padding:.85rem 1rem;border-radius:var(--radius-md)}
    .site-header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--color-bg) 84%, transparent);backdrop-filter:blur(16px);border-bottom:1px solid color-mix(in srgb,var(--color-text) 10%, transparent)}
    .nav{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) 0}
    .brand{display:flex;align-items:center;gap:var(--space-3);font-weight:800;letter-spacing:-.03em}
    .brand-mark{width:2.5rem;height:2.5rem;object-fit:contain}
    .nav-links{display:flex;gap:var(--space-4);align-items:center;flex-wrap:wrap}
    .nav-links a{font-size:var(--text-sm);color:var(--color-text-muted)}
    .nav-links a:hover{color:var(--color-text)}
    .btn,.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem 1.2rem;border-radius:var(--radius-full);border:1px solid transparent;cursor:pointer;transition:.2s ease}
    .btn-primary{background:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-md)}
    .btn-primary:hover{background:var(--color-primary-hover)}
    .btn-secondary,.theme-toggle{background:var(--color-surface);border-color:color-mix(in srgb,var(--color-text) 12%, transparent);color:var(--color-text)}
    .hero{padding:clamp(4rem,8vw,8rem) 0 4rem}
    .ambient-scene,.hero-scene,.contact-scene{position:relative;overflow:hidden;isolation:isolate}
    .hero-layer,.scene-layer,.ambient-scene>.container{position:relative;z-index:2}
    .scene-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.81}
    .scene-glow{position:absolute;inset:0;pointer-events:none;z-index:1}
    .scene-glow-hero{background:radial-gradient(ellipse 60% 50% at 20% 50%,color-mix(in srgb,var(--color-primary) 14%, transparent) 0%,transparent 72%)}
    .scene-glow-contact{background:radial-gradient(ellipse 50% 60% at 80% 50%,color-mix(in srgb,var(--color-primary) 14%, transparent) 0%,transparent 72%)}
    .ambient-scene:not(.hero-scene):not(.contact-scene)::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse 70% 65% at 50% 45%,color-mix(in srgb,var(--color-primary) 7%, transparent) 0%,transparent 75%)}
    .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-8);align-items:center}
    .eyebrow{display:inline-flex;align-items:center;gap:.5rem;background:var(--color-primary-soft);color:var(--color-primary);padding:.5rem .85rem;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
    .eyebrow::before{content:'';width:.4rem;height:.4rem;border-radius:50%;background:currentColor;opacity:.8}
    h1,h2,h3,h4{font-family:var(--font-display);line-height:1.05;letter-spacing:-.04em;margin:0}
    h1{font-size:var(--text-3xl);max-width:13ch;margin:1rem 0}
    h2{font-size:var(--text-2xl);margin-bottom:var(--space-4)}
    h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
    p{margin:0;color:var(--color-text-muted);max-width:72ch}
    .hero-copy p{font-size:var(--text-lg);max-width:48ch}
    .hero-actions,.cta-actions,.contact-actions{display:flex;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-6)}
    .hero-panel{background:linear-gradient(180deg,var(--color-surface),var(--color-surface-2));border:1px solid color-mix(in srgb,var(--color-text) 10%, transparent);border-radius:calc(var(--radius-xl) + .25rem);padding:var(--space-6);box-shadow:var(--shadow-lg)}
    .hero-stats{display:grid;gap:var(--space-4);margin-top:var(--space-5)}
    .hero-stat{padding:var(--space-4);background:var(--color-surface);border:1px solid color-mix(in srgb,var(--color-text) 8%, transparent);border-radius:var(--radius-lg)}
    .hero-stat strong{display:block;font-size:var(--text-xl);font-family:var(--font-display);color:var(--color-text)}
    .section{padding:clamp(3.5rem,6vw,6rem) 0}
    .section-head{display:grid;gap:var(--space-3);margin-bottom:var(--space-8)}
    .grid-2,.grid-3,.packaging-grid,.ops-grid,.footer-grid,.portfolio-grid,.proof-grid,.contact-grid{display:grid;gap:var(--space-5)}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .grid-3{grid-template-columns:repeat(3,1fr)}
    .packaging-grid{grid-template-columns:repeat(3,1fr)}
    .ops-grid{grid-template-columns:1.1fr .9fr}
    .portfolio-grid{grid-template-columns:repeat(2,1fr)}
    .proof-grid{grid-template-columns:repeat(4,1fr)}
    .contact-grid{grid-template-columns:1fr .95fr}
    .footer-grid{grid-template-columns:1.1fr .9fr}
    .card,.panel,.pack-card,.timeline-item,.proof-card,.contact-card{background:var(--color-surface);border:1px solid color-mix(in srgb,var(--color-text) 10%, transparent);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}
    .card,.panel,.pack-card,.proof-card,.contact-card{padding:var(--space-6)}
    .card,.panel,.pack-card,.proof-card{transition:border-color .2s ease,box-shadow .2s ease}
    .card:hover,.panel:hover,.pack-card:hover,.proof-card:hover{border-color:color-mix(in srgb,var(--color-primary) 28%, var(--color-border));box-shadow:var(--shadow-md)}
    .panel-tint{background:linear-gradient(180deg,color-mix(in srgb,var(--color-primary) 5%, var(--color-surface)),var(--color-surface))}
    .label{font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-faint);font-weight:700}
    ul.clean{list-style:none;padding:0;margin:0;display:grid;gap:.75rem}
    ul.clean li{position:relative;padding-left:1.2rem;color:var(--color-text-muted)}
    ul.clean li::before{content:'';position:absolute;left:0;top:.65rem;width:.42rem;height:.42rem;border-radius:50%;background:var(--color-primary)}
    .process{display:grid;gap:var(--space-4)}
    .timeline-item{padding:var(--space-5)}
    .number{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-primary);font-weight:800;margin-bottom:var(--space-2)}
    .table-wrap{overflow:auto;border-radius:var(--radius-xl);border:1px solid color-mix(in srgb,var(--color-text) 10%, transparent);background:var(--color-surface);box-shadow:var(--shadow-sm)}
    table{width:100%;border-collapse:collapse;min-width:760px}
    th,td{padding:1rem;text-align:left;vertical-align:top;border-bottom:1px solid color-mix(in srgb,var(--color-text) 8%, transparent)}
    th{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-faint)}
    td{color:var(--color-text-muted)}
    .highlight{color:var(--color-text);font-weight:700}
    .proof-card strong{display:block;font-size:var(--text-xl);font-family:var(--font-display);margin-bottom:.35rem}
    .band{background:var(--color-surface-2);border-block:1px solid color-mix(in srgb,var(--color-text) 8%, transparent)}
    .pack-card h3{margin-bottom:var(--space-4)}
    .pack-card .badge{margin-bottom:var(--space-3)}
    .badge{display:inline-flex;padding:.45rem .75rem;border-radius:var(--radius-full);background:var(--color-surface-2);font-size:var(--text-xs);font-weight:700;color:var(--color-text)}
    .portfolio-note{padding:var(--space-5);border-radius:var(--radius-lg);background:color-mix(in srgb,var(--color-warning) 10%, var(--color-surface));border:1px solid color-mix(in srgb,var(--color-warning) 25%, transparent)}
    .portfolio-grid .card{display:flex;flex-direction:column;gap:var(--space-3)}
    .case-link{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-primary);margin-top:auto}
    .case-link::after{content:'->';transition:transform .2s ease}
    .case-link:hover::after{transform:translateX(3px)}
    .contact-list{display:grid;gap:1rem}
    .contact-item{padding:var(--space-4);border-radius:var(--radius-lg);background:var(--color-surface-2)}
    .cta{padding-bottom:clamp(4rem,7vw,7rem)}
    .cta-box{padding:clamp(2rem,4vw,4rem);border-radius:calc(var(--radius-xl) + .5rem);background:linear-gradient(180deg,var(--color-surface),var(--color-surface-2));border:1px solid color-mix(in srgb,var(--color-text) 10%, transparent);box-shadow:var(--shadow-lg)}
    .site-footer{padding:var(--space-8) 0;border-top:1px solid color-mix(in srgb,var(--color-text) 10%, transparent)}
    .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--text-sm);color:var(--color-text-muted)}
    .divider{height:1px;background:color-mix(in srgb,var(--color-text) 10%, transparent);margin:var(--space-6) 0}
    .testimonial{font-size:var(--text-lg);color:var(--color-text);max-width:40ch}
    @media (prefers-reduced-motion: reduce){.scene-canvas{display:none}}
    @media (max-width: 1040px){.hero-grid,.grid-3,.grid-2,.packaging-grid,.ops-grid,.proof-grid,.portfolio-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}}
    @media (max-width: 760px){.nav{align-items:flex-start}.nav-links{display:none}.hero{padding-top:3rem}.hero-actions,.cta-actions,.contact-actions{flex-direction:column;align-items:stretch}.btn,.theme-toggle{width:100%}h1{max-width:100%}}
