:root { --background:#101716; --foreground:#eee8dc; --primary:#d63a2f; --primary-foreground:#fffaf0; --border:rgba(238,232,220,.2); --input:rgba(16,23,22,.24); --ring:#d63a2f; --destructive:#d63a2f; --radius:0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--background); color:var(--foreground); font-family:'DM Sans',sans-serif; text-rendering:optimizeLegibility; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.hero { min-height:94vh; overflow:hidden; background:#101716; color:#eee8dc; }
.nav { height:102px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(238,232,220,.16); }
.brand { font-size:1rem; font-weight:800; letter-spacing:-.04em; }.brand span { color:#d63a2f; }.brand small { font-size:.62em; font-weight:700; opacity:.65; }
.nav-link { display:flex; align-items:center; gap:10px; text-transform:uppercase; font-size:.7rem; font-weight:700; letter-spacing:.14em; }.nav-link svg { width:15px; }
.hero-grid { min-height:calc(94vh - 102px); display:grid; grid-template-columns:1fr 1fr; gap:92px; align-items:center; padding-block:68px; }
.eyebrow,.section-number { display:flex; align-items:center; gap:11px; color:#8f9b96; font-size:.67rem; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }.eyebrow span { width:30px; height:2px; background:#d63a2f; }
h1,h2 { margin:0; font-family:'Instrument Serif',Georgia,serif; font-weight:400; letter-spacing:-.055em; line-height:.91; }
h1 { max-width:650px; margin-top:28px; font-size:clamp(4.4rem,8vw,8rem); } h1 em,h2 em { color:#d63a2f; font-weight:400; }
.hero-lede { max-width:530px; margin:32px 0 36px; color:#aeb7b2; font-size:clamp(1rem,1.5vw,1.18rem); line-height:1.7; }
.primary-link { display:inline-flex; align-items:center; gap:20px; padding:18px 21px; background:#d63a2f; color:#fffaf0; font-size:.76rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; transition:transform .2s,background .2s; }.primary-link:hover { background:#b92e25; transform:translateY(-2px); }.primary-link svg { width:17px; }
.photo-card { position:relative; display:flex; flex-direction:column; min-height:590px; padding:15px; background:#e9e2d5; color:#101716; box-shadow:24px 24px 0 rgba(214,58,47,.75); transform:rotate(1.15deg); }
.frame-meta { display:flex; justify-content:space-between; align-items:center; padding:5px 2px; font-size:.58rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }.frame-meta-top { margin-bottom:10px; }.frame-meta-bottom { margin-top:10px; }.frame-meta-bottom span { display:flex; align-items:center; gap:6px; }.frame-meta-bottom svg { width:12px; }
.photo-window { position:relative; min-height:340px; overflow:hidden; background:#253b39; }.photo-placeholder { position:absolute; inset:0; overflow:hidden; background:#253b39 url('og.png') 72% center/cover no-repeat; }.sun,.ridge { display:none; }
.focus-mark { position:absolute; left:18px; top:18px; color:rgba(255,255,255,.72); }.focus-mark svg { width:25px; }.available { position:absolute; right:17px; bottom:16px; display:flex; align-items:center; gap:7px; padding:9px 11px; background:#e9e2d5; font-size:.61rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }.available i { width:7px; height:7px; border-radius:50%; background:#39a46b; box-shadow:0 0 0 3px rgba(57,164,107,.16); }
.domain-lockup { display:flex; align-items:baseline; margin:auto 0; padding:24px 5px 15px; font-family:'Instrument Serif',Georgia,serif; font-size:clamp(3.9rem,6vw,6.6rem); letter-spacing:-.07em; line-height:.75; }.domain-lockup strong { font-weight:400; }.domain-lockup em { color:#d63a2f; font-weight:400; }.domain-lockup small { margin-left:5px; font-family:'DM Sans',sans-serif; font-size:.16em; font-style:normal; font-weight:800; letter-spacing:.02em; }
.case-section { padding:132px 0; background:#eee8dc; color:#15201f; }.case-grid { display:grid; grid-template-columns:1fr 1fr; gap:120px; align-items:end; }.case-section .section-number { color:#65706c; }.case-section h2 { margin-top:30px; font-size:clamp(3.5rem,6vw,6.5rem); }.case-copy>p { margin:0 0 38px; color:#5a6461; font-size:1.08rem; line-height:1.78; }.case-copy ul { margin:0; padding:0; list-style:none; border-top:1px solid rgba(21,32,31,.18); }.case-copy li { display:flex; align-items:center; gap:13px; padding:17px 0; border-bottom:1px solid rgba(21,32,31,.18); font-weight:600; }.case-copy li svg { width:18px; color:#d63a2f; }
.contact-section { padding:130px 0; background:#d63a2f; color:#fffaf0; }.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:125px; }.section-number.light { color:rgba(255,250,240,.68); }.contact-intro h2 { margin-top:30px; font-size:clamp(4rem,7vw,7rem); }.contact-intro h2 em { color:#101716; }.contact-intro>p { max-width:430px; margin:32px 0; color:rgba(255,250,240,.82); font-size:1.04rem; line-height:1.72; }.privacy-note { display:flex; flex-direction:column; gap:5px; padding-top:25px; border-top:1px solid rgba(255,255,255,.28); font-size:.73rem; text-transform:uppercase; letter-spacing:.12em; }.privacy-note span { opacity:.65; }.privacy-note strong { font-size:.88rem; }
.contact-form { display:flex; flex-direction:column; gap:23px; padding:44px; background:#eee8dc; color:#15201f; box-shadow:18px 18px 0 rgba(88,13,9,.18); }.form-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; }.contact-form label { display:flex; flex-direction:column; gap:8px; width:100%; min-width:0; font-size:.71rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }.contact-form label small { display:inline; color:#78817e; font-weight:500; }.contact-form input,.contact-form textarea { display:block; width:100%; min-width:0; border:0; border-bottom:1px solid rgba(21,32,31,.3); border-radius:0; background:transparent; padding:10px 0; color:#15201f; font:500 .92rem 'DM Sans',sans-serif; text-transform:none; letter-spacing:normal; box-shadow:none; outline:none; }.contact-form input { height:47px; }.contact-form textarea { min-height:110px; resize:vertical; line-height:1.5; }.contact-form input:focus,.contact-form textarea:focus { border-color:#d63a2f; box-shadow:0 1px 0 #d63a2f; }.submit-button { width:100%; height:58px; border:0; border-radius:0; background:#101716; color:#fffaf0; font:800 .75rem 'DM Sans',sans-serif; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; }.submit-button:hover { background:#25312f; }.submit-button:disabled { cursor:wait; opacity:.7; }.submit-button span { margin-left:8px; }.form-legal { margin:-7px 0 0; text-align:center; color:#727b78; font-size:.7rem; }.honey { position:absolute; left:-9999px; }.notice { padding:16px 18px; border-left:3px solid; font-size:.88rem; line-height:1.55; }.notice ul { margin:8px 0 0; padding-left:18px; }.notice.success { background:#e6f4eb; border-color:#3b8b59; color:#1e5d36; }.notice.error { background:#fbe9e4; border-color:#c94429; color:#7d2919; }
footer { background:#0a100f; color:rgba(255,250,240,.58); }.footer-inner { min-height:80px; display:flex; align-items:center; justify-content:space-between; font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; }
@media(max-width:850px) { .hero-grid,.case-grid,.contact-grid { grid-template-columns:1fr; gap:68px; }.hero-grid { padding-top:60px; }.photo-card { min-height:540px; max-width:570px; width:100%; }.case-section,.contact-section { padding-block:96px; } }
@media(max-width:560px) { .shell { width:min(100% - 32px,1180px); }.nav { height:82px; }.nav-link { font-size:.6rem; } h1 { font-size:4rem; }.hero-grid { min-height:auto; gap:58px; padding-block:55px 80px; }.photo-card { min-height:435px; padding:11px; box-shadow:12px 12px 0 rgba(214,58,47,.75); }.photo-window { min-height:245px; }.domain-lockup { font-size:4rem; }.case-section,.contact-section { padding-block:76px; }.case-grid,.contact-grid { gap:48px; }.form-row { grid-template-columns:1fr; }.contact-form { padding:30px 24px; box-shadow:10px 10px 0 rgba(88,13,9,.18); }.footer-inner { min-height:94px; align-items:flex-start; justify-content:center; flex-direction:column; gap:8px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; } }
