@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,600;1,600&family=DM+Sans:wght@400;500;600&family=Space+Grotesk:wght@500;600&display=swap');

:root { --ink:#090d19; --paper:#f1f4f4; --cream:#e3e9e8; --moss:#3f8278; --lime:#86ddd0; --rust:#9b82e5; --line:rgba(9,13,25,.18); --serif:'Cormorant Garamond',Georgia,serif; --sans:'DM Sans',Arial,sans-serif; --geometric:'Space Grotesk',Arial,sans-serif; }
* { box-sizing:border-box; }
html { max-width:100%; overflow-x:hidden; scroll-behavior:smooth; }
body { width:100%; max-width:100%; margin:0; overflow-x:hidden; color:var(--ink); background:radial-gradient(circle at 8% 14%,rgba(134,221,208,.2),transparent 27%),radial-gradient(circle at 92% 38%,rgba(155,130,229,.18),transparent 24%),linear-gradient(145deg,#f3f7f6 0%,#e8eff0 48%,#eeeaf4 100%); background-attachment:fixed; font-family:var(--sans); }
main { width:100%; max-width:100%; overflow:clip; }
a { color:inherit; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:20; padding:.8rem 1rem; background:white; }
.skip-link:focus { top:1rem; }
.site-header { height:76px; padding:0 clamp(1rem,4vw,4rem); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(244,241,233,.9); backdrop-filter:blur(12px); position:sticky; top:0; z-index:10; }
.brand { display:flex; gap:.65rem; align-items:center; text-decoration:none; font:600 .82rem var(--geometric); letter-spacing:.2em; }
.brand-mark { display:grid; place-items:center; width:34px; aspect-ratio:1; border:1px solid currentColor; border-radius:50%; font-family:var(--serif); font-size:1.2rem; letter-spacing:0; }
.request-logo-button { width:50px; height:50px; flex:0 0 auto; overflow:hidden; display:block; border:2px solid #05070b; border-radius:50%; background:#000; box-shadow:0 4px 16px rgba(9,13,25,.18); transition:transform .2s,box-shadow .2s; }
.request-logo-button img { width:100%; height:100%; display:block; object-fit:cover; transform:scale(1.16); }
.request-logo-button:hover,.request-logo-button:focus { transform:translateY(-2px) scale(1.03); box-shadow:0 7px 22px rgba(9,13,25,.28); outline:2px solid var(--rust); outline-offset:2px; }
.button { min-height:52px; padding:0 1.35rem; border:0; display:inline-flex; align-items:center; justify-content:center; gap:1.2rem; text-transform:uppercase; letter-spacing:.1em; font:600 .73rem var(--sans); text-decoration:none; cursor:pointer; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-small { min-height:42px; padding:0 1rem; }
.button-ink { color:var(--paper); background:var(--ink); }
.button-primary { color:var(--ink); background:var(--lime); }
.text-link { padding:.4rem 0; border:0; border-bottom:1px solid currentColor; background:none; font:600 .75rem var(--sans); text-transform:uppercase; letter-spacing:.1em; text-decoration:none; cursor:pointer; }
.hero { min-height:calc(100svh - 76px); position:relative; overflow:hidden; display:flex; align-items:center; background:radial-gradient(circle at 78% 20%,rgba(134,221,208,.24),transparent 22%),radial-gradient(circle at 88% 82%,rgba(155,130,229,.2),transparent 28%),linear-gradient(135deg,rgba(241,244,244,.9),rgba(228,238,238,.78)); isolation:isolate; }
.hero:after { content:""; position:absolute; z-index:-1; width:min(62vw,760px); aspect-ratio:1; right:-15%; border:1px solid rgba(63,130,120,.16); border-radius:50%; box-shadow:0 0 0 10vw rgba(155,130,229,.035),0 0 0 20vw rgba(63,130,120,.025); }
.hero-copy { width:min(100%,1200px); display:flex; flex-direction:column; justify-content:center; padding:clamp(4rem,9vw,9rem) clamp(1.25rem,10vw,10rem); }
.eyebrow { margin:0 0 1.4rem; font:600 .7rem var(--geometric); letter-spacing:.23em; text-transform:uppercase; }
h1,h2 { margin:0; font-family:var(--serif); font-weight:600; line-height:.95; letter-spacing:-.04em; }
h1 { font-size:clamp(3.8rem,7.8vw,8.5rem); }
h2 { font-size:clamp(3rem,5.7vw,6.1rem); }
em { color:var(--rust); font-weight:600; }
.hero-intro { max-width:580px; margin:2rem 0; font-size:clamp(1rem,1.5vw,1.2rem); line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:2rem; flex-wrap:wrap; }
.idea-starter { position:relative; min-height:600px; overflow:hidden; display:grid; place-items:center; padding:clamp(1.25rem,5vw,5rem); color:var(--paper); background:radial-gradient(circle at 12% 14%,rgba(134,221,208,.25),transparent 30%),radial-gradient(circle at 92% 86%,rgba(155,130,229,.28),transparent 34%),linear-gradient(150deg,#07111d,#0c2c35 54%,#21183e); isolation:isolate; }
.idea-starter:before { content:""; position:absolute; inset:-20%; z-index:-1; opacity:.13; background:repeating-radial-gradient(circle at 15% 20%,transparent 0 42px,#b9fff2 43px 44px,transparent 45px 84px); transform:rotate(-12deg); }
.idea-starter-inner { width:min(100%,560px); padding:clamp(1.3rem,4vw,2.5rem); border:1px solid rgba(241,244,244,.22); background:rgba(5,11,20,.58); backdrop-filter:blur(18px); box-shadow:0 24px 80px rgba(0,0,0,.26); }
.idea-starter h2 { font-size:clamp(2.7rem,4.8vw,5.2rem); }
.idea-starter-inner>p:not(.eyebrow):not(.starter-note) { max-width:430px; margin:1.25rem 0 1.6rem; color:#cedbd8; line-height:1.6; }
.starter-label { display:block; font:600 .7rem var(--geometric); letter-spacing:.13em; text-transform:uppercase; }
.idea-starter textarea { min-height:118px; margin:.6rem 0 1.4rem; border-color:rgba(241,244,244,.34); color:var(--paper); background:rgba(241,244,244,.07); }
.idea-starter textarea::placeholder { color:#a8b7b3; }
.idea-starter textarea:focus { outline-color:var(--lime); }
.mood-picker { margin:0 0 1.4rem; padding:0; border:0; }
.mood-picker legend { margin-bottom:.7rem; font:600 .7rem var(--geometric); letter-spacing:.13em; text-transform:uppercase; }
.mood-picker legend span { margin-left:.5rem; opacity:.55; }
.mood-picker>div { display:flex; flex-wrap:wrap; gap:.5rem; }
.mood-picker button { padding:.62rem .85rem; border:1px solid rgba(241,244,244,.28); border-radius:99px; color:var(--paper); background:transparent; font:500 .76rem var(--sans); cursor:pointer; }
.mood-picker button:hover,.mood-picker button:focus { border-color:var(--lime); outline:none; }
.mood-picker button[aria-pressed="true"] { color:var(--ink); border-color:var(--lime); background:var(--lime); }
.starter-continue { width:100%; }
.starter-note { margin:.8rem 0 0; text-align:center; color:#aebbb8; font-size:.7rem; }
.section { padding:clamp(5rem,10vw,10rem) clamp(1.25rem,5vw,5rem); }
.section-heading { display:grid; grid-template-columns:1.5fr 1fr; gap:3rem; align-items:end; margin-bottom:3rem; }
.section-heading>p { max-width:500px; line-height:1.7; }
.gallery { position:relative; overflow:hidden; isolation:isolate; background:linear-gradient(180deg,rgba(241,244,244,.5),rgba(226,235,235,.86)); }
.gallery:before { content:""; position:absolute; z-index:-1; width:45vw; aspect-ratio:1; right:-18vw; top:4rem; border:1px solid rgba(63,130,120,.18); border-radius:50%; box-shadow:0 0 0 7vw rgba(155,130,229,.035),0 0 0 14vw rgba(63,130,120,.03); }
.gallery-grid { display:grid; grid-template-columns:1.3fr .7fr 1fr; grid-template-rows:330px 300px; grid-auto-rows:300px; gap:1rem; }
.art-card { position:relative; overflow:hidden; min-height:260px; background-color:#778; cursor:zoom-in; }
.art-card:before,.art-card:after { content:""; position:absolute; }
.art-card>img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .55s; }
.art-card:hover>img,.art-card:focus>img { transform:scale(1.035); filter:saturate(1.08); }
.art-card:focus { outline:3px solid var(--rust); outline-offset:3px; }
.art-featured { grid-row:span 2; background:#07101e; }
.art-featured>img { object-position:58% 48%; }
.art-nature { grid-row:span 2; background:linear-gradient(155deg,#a1ddd2,#24766e 50%,#071d2b); }
.art-nature:before { width:80%; height:85%; left:10%; bottom:-18%; border-radius:50% 50% 0 0; background:repeating-radial-gradient(ellipse at bottom,#092530 0 14px,#3b9182 15px 19px); }
.art-cybernetic { grid-column:span 2; background:#090d19; }
.art-cybernetic>img { object-position:48% 48%; }
.art-twins { background:#29322f; }
.art-twins>img { object-position:50% 35%; }
.art-scaled { background:#211b15; }
.art-scaled>img { object-position:50% 38%; }
.art-pacific { grid-column:span 2; background:#071426; }
.art-pacific>img { object-position:50% 48%; }
.art-joy { background:#5c2d21; }
.art-joy>img { object-position:50% 44%; }
.art-sparked { background:#071817; }
.art-sparked>img { object-position:50% 52%; }
.art-prince { grid-column:span 2; background:#073329; }
.art-prince>img { object-position:50% 42%; }
.art-label { position:absolute; z-index:2; left:1rem; right:1rem; bottom:1rem; padding:1rem; display:flex; justify-content:space-between; gap:.5rem; align-items:end; color:var(--paper); background:rgba(23,35,31,.82); }
.art-label span { font-family:var(--serif); font-size:1.2rem; }
.art-label span strong { display:block; font-weight:600; }
.art-label span small { display:block; max-width:430px; margin-top:.35rem; font:400 .72rem/1.45 var(--sans); }
.art-label>small{opacity:.7;white-space:nowrap}
.gallery-note { margin-top:1rem; font-size:.76rem; opacity:.65; }
.lightbox { width:100vw; max-width:none; height:100dvh; max-height:none; margin:0; padding:clamp(1rem,3vw,2.5rem); border:0; color:var(--paper); background:rgba(5,8,17,.97); }
.lightbox::backdrop { background:rgba(2,4,9,.92); backdrop-filter:blur(12px); }
.lightbox[open] { display:grid; grid-template-columns:minmax(44px,6vw) minmax(0,1fr) minmax(44px,6vw); align-items:center; }
.lightbox figure { min-width:0; max-height:calc(100dvh - 4rem); margin:0; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr); gap:clamp(1.5rem,4vw,4rem); align-items:center; touch-action:pan-y; }
.lightbox figure>img { width:100%; max-height:calc(100dvh - 5rem); object-fit:contain; user-select:none; -webkit-user-drag:none; }
.lightbox figcaption { max-width:440px; }
.lightbox figcaption h2 { font-size:clamp(3rem,6vw,6rem); }
.lightbox figcaption>p:not(.eyebrow):not(.lightbox-count) { font-size:1rem; line-height:1.7; color:#d3ddda; }
.lightbox-count { margin-top:2rem; font:500 .7rem var(--geometric); letter-spacing:.16em; opacity:.6; }
.lightbox-close,.lightbox-nav { border:0; color:var(--paper); background:transparent; cursor:pointer; font-family:var(--geometric); }
.lightbox-close { position:absolute; z-index:2; top:1rem; right:1.2rem; width:48px; height:48px; font-size:2rem; }
.lightbox-nav { min-width:44px; min-height:64px; font-size:3rem; opacity:.65; transition:opacity .2s,transform .2s; }
.lightbox-nav:hover,.lightbox-nav:focus,.lightbox-close:hover,.lightbox-close:focus { opacity:1; transform:scale(1.08); outline:2px solid var(--lime); outline-offset:2px; }
.possibilities { color:var(--paper); text-align:center; background:var(--ink); }
.possibilities h2 { max-width:900px; margin:auto; }
.pill-list { max-width:1000px; margin:3.5rem auto 2rem; display:flex; justify-content:center; flex-wrap:wrap; gap:.65rem; }
.pill-list span { padding:.8rem 1.15rem; border:1px solid #f4f1e94d; border-radius:99px; font-size:.85rem; }
.reassurance { max-width:650px; margin:3rem auto 0; line-height:1.7; color:#d9d4c9; }
.request-section { display:grid; grid-template-columns:.78fr 1.22fr; gap:clamp(3rem,8vw,9rem); align-items:start; background:radial-gradient(circle at 12% 24%,rgba(134,221,208,.2),transparent 28%),radial-gradient(circle at 88% 72%,rgba(155,130,229,.16),transparent 25%),rgba(241,244,244,.78); }
.request-intro { position:sticky; top:130px; }
.request-intro>p:not(.eyebrow) { margin:2rem 0; max-width:450px; line-height:1.7; }
.steps { margin:3rem 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.steps li { padding:1rem 0; display:flex; gap:1.2rem; border-bottom:1px solid var(--line); font-size:.9rem; }.steps span{opacity:.5}
.request-form { padding:clamp(1.2rem,4vw,3rem); border:1px solid var(--line); background:#f8faf9; }
.request-form label { display:block; margin-bottom:1.6rem; font-weight:600; font-size:.85rem; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
input,textarea,select { width:100%; margin-top:.55rem; padding:1rem; border:1px solid var(--line); border-radius:0; color:var(--ink); background:transparent; font:1rem var(--sans); line-height:1.5; }
textarea { resize:vertical; }
select { min-height:56px; appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%); background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%; background-size:5px 5px,5px 5px; background-repeat:no-repeat; }
input:focus,textarea:focus,select:focus { outline:2px solid var(--moss); outline-offset:2px; }
label small { display:block; margin-top:.5rem; font-weight:400; color:#59635f; line-height:1.5; }
.optional { float:right; font-size:.68rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; opacity:.55; }
.file-field { min-height:100px; margin-top:.55rem; padding:1rem; display:flex; align-items:center; justify-content:center; border:1px dashed #667b5a; text-align:center; cursor:pointer; }
.file-field input { position:absolute; width:1px; height:1px; opacity:0; }
.file-field strong { display:block; color:var(--moss); }.file-list{display:block;margin-top:.5rem;font-size:.76rem;font-weight:400}
.form-message { margin-bottom:1rem; color:#9f3d2c; font-size:.85rem; }
.submit-button { width:100%; }
.privacy-note { margin:1rem 0 0; font-size:.72rem; line-height:1.5; opacity:.62; text-align:center; }
.confirmation { padding:clamp(2rem,6vw,5rem); border:1px solid var(--line); background:#f8faf9; }
.confirmation-mark { width:64px; aspect-ratio:1; margin-bottom:2rem; display:grid; place-items:center; border-radius:50%; background:var(--lime); font-size:1.5rem; }
.confirmation h2 { font-size:clamp(2.5rem,5vw,4.5rem); }.confirmation>p:not(.eyebrow){max-width:550px;line-height:1.7;margin:2rem 0}
footer { padding:2rem clamp(1.25rem,5vw,5rem); display:grid; grid-template-columns:1fr auto 1fr; gap:1rem; align-items:center; color:var(--paper); background:#060912; font-size:.76rem; } footer p:last-child{text-align:right}
@media (max-width:800px) {
  .site-header { height:66px; }.request-logo-button{width:46px;height:46px}
  .hero { display:block; }.hero-copy{min-height:calc(100svh - 66px);padding-top:4rem;padding-bottom:4rem}.idea-starter{min-height:auto;padding-top:4rem;padding-bottom:4rem}
  .section-heading,.request-section { grid-template-columns:1fr; }.section-heading{gap:1rem}.section-heading>p{margin-bottom:0}
  .gallery-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:420px 260px 260px;grid-auto-rows:260px}.art-featured{grid-column:span 2;grid-row:auto}.art-cybernetic,.art-pacific{grid-column:span 2}.art-twins,.art-scaled,.art-joy,.art-sparked,.art-prince{grid-column:auto}
  .request-intro{position:static}.field-row{grid-template-columns:1fr}.request-form{padding:1.25rem}.request-section{gap:3rem}
  .lightbox[open]{grid-template-columns:44px minmax(0,1fr) 44px;padding:1rem .35rem}.lightbox figure{display:flex;flex-direction:column;gap:1rem;max-height:calc(100dvh - 2rem);overflow-y:auto}.lightbox figure>img{max-height:64dvh}.lightbox figcaption{width:100%;padding:0 .75rem 1rem}.lightbox figcaption h2{font-size:2.8rem}.lightbox figcaption>p:not(.eyebrow):not(.lightbox-count){margin:.6rem 0}.lightbox .eyebrow{margin-bottom:.5rem}.lightbox-nav{font-size:2.2rem}
  footer{grid-template-columns:1fr auto}footer p:nth-child(2){display:none}
}
@media (max-width:480px) {
  h1{font-size:3.55rem}.hero-actions{align-items:stretch;flex-direction:column}.hero-actions .text-link{align-self:flex-start}.idea-starter{padding:3rem 1rem}.idea-starter-inner{padding:1.25rem}.idea-starter h2{font-size:3rem}
  .gallery{padding-right:0}.gallery-grid{display:flex;width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;padding-right:1.25rem}.art-card{min-width:calc(83vw - 1.25rem);height:420px;scroll-snap-align:start}
  .art-label{display:block}.art-label small{display:block;margin-top:.35rem}.pill-list{justify-content:flex-start}.possibilities{text-align:left}
  footer .brand span:last-child{display:none}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
