* { box-sizing:border-box; }
:root { --bg:#f7f2e9; --card:#fffdfa; --ink:#17202a; --navy:#111b29; --muted:#6e6c68; --line:#ddd6c9; --gold:#bc873d; --gold-light:#e7c78c; --danger:#a53427; --accent:#17202a; --accent-dark:#0c121b; --text:#17202a; }
html { font-size:16px; }
body { margin:0; min-height:100vh; font-family:system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif; color:var(--ink); background:radial-gradient(circle at 50% 0,#fffaf1 0,transparent 50%),var(--bg); }
.page { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:22px 14px 18px; }
.experience { width:min(100%,440px); overflow:hidden; border-radius:24px; background:var(--card); border:1px solid #e7dfd3; box-shadow:0 22px 65px rgba(53,35,16,.1); }
.brandBar { display:flex; align-items:center; gap:11px; background:var(--navy); color:#fff5e4; padding:16px 19px; }
.brandFlower { display:grid; place-items:center; color:var(--gold-light); width:33px; height:33px; border:1px solid rgba(231,199,140,.65); border-radius:50%; font-size:22px; line-height:1; }
.brandWordmark { display:flex; flex-direction:column; line-height:1; gap:3px; flex:1; }
.brandWordmark strong { font-size:21px; letter-spacing:-.055em; font-weight:800; }
.brandWordmark small { font-family:Georgia,serif; font-size:9px; letter-spacing:.23em; color:var(--gold-light); }
.brandTag { color:#dbc393; font-size:10px; white-space:nowrap; letter-spacing:-.02em; }
.hero { height:196px; overflow:hidden; position:relative; background:#1a1c1e; }
.hero img { width:100%; height:100%; object-fit:cover; object-position:center 47%; display:block; }
.hero::after { content:""; position:absolute; inset:auto 0 0; height:45px; background:linear-gradient(transparent,rgba(14,15,17,.22)); pointer-events:none; }
.heroCorner { position:absolute; right:15px; top:13px; width:29px; height:29px; border-radius:50%; background:rgba(19,24,28,.72); color:#edcd90; display:grid; place-items:center; font-size:20px; }
.formContent { padding:25px 29px 25px; }
.eyebrow { color:var(--gold); font-size:11px; font-weight:800; letter-spacing:.02em; display:flex; align-items:center; gap:7px; margin-bottom:9px; }
.eyebrowLine { display:inline-block; width:19px; height:1px; background:var(--gold); }
h1,h2 { margin:0; line-height:1.3; letter-spacing:-.035em; }
h1 { font-size:clamp(24px,6vw,29px); }
h2 { font-size:26px; }
.subtitle { color:var(--muted); font-size:13px; line-height:1.6; margin:9px 0 22px; }
.qrNotice { display:flex; align-items:center; gap:11px; padding:13px 15px; margin:-3px 0 23px; border:1px solid #b7d4bd; border-radius:13px; background:#eef8ef; color:#1d633b; }
.qrNotice > span { flex:0 0 auto; display:grid; place-items:center; width:32px; height:32px; border:1px solid #7eb18a; border-radius:50%; font-size:19px; font-weight:800; }
.qrNotice p { margin:0; font-size:13px; font-weight:750; line-height:1.4; }
.qrNotice small { display:block; margin-top:3px; font-size:11px; font-weight:400; line-height:1.4; color:#346e4c; }
.field { display:block; margin-bottom:13px; }
.field > span { display:block; font-size:13px; font-weight:750; margin-bottom:7px; }
b { color:var(--danger); }
input[type="text"],input[type="tel"],input[type="url"],textarea { width:100%; height:52px; padding:0 14px; border:1px solid var(--line); border-radius:10px; outline:none; background:#fff; color:var(--ink); font:inherit; font-size:16px; transition:border-color .15s,box-shadow .15s; }
textarea { min-height:110px; height:auto; padding:12px 14px; resize:vertical; line-height:1.5; }
input::placeholder { color:#aaa8a2; }
input:focus,textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(188,135,61,.15); }
input[aria-invalid="true"],textarea[aria-invalid="true"] { border-color:var(--danger); }
.error { display:block; min-height:15px; color:var(--danger); font-size:11px; margin-top:3px; }
.consent { display:flex; align-items:flex-start; gap:10px; padding:12px; border:1px solid #eee4d3; border-radius:10px; background:#fbf5e9; color:#534b40; font-size:12px; line-height:1.5; cursor:pointer; }
.consent input { width:18px; height:18px; margin:1px 0 0; flex:0 0 auto; accent-color:var(--navy); }
.consentError { margin-left:2px; }
button,.secondary { width:100%; min-height:52px; border-radius:10px; font:inherit; font-weight:750; cursor:pointer; text-decoration:none; display:flex; align-items:center; justify-content:center; gap:12px; }
button { border:1px solid var(--navy); background:var(--navy); color:#fff9ee; margin-top:7px; box-shadow:0 7px 17px rgba(17,27,41,.16); }
button:hover:not(:disabled) { background:#26354a; }
button:disabled { opacity:.47; cursor:not-allowed; box-shadow:none; }
.privacy { color:#9a9184; text-align:center; font-size:10px; line-height:1.5; margin:10px 0 0; }
.goldRule { height:14px; background:var(--navy); display:flex; align-items:center; justify-content:center; color:var(--gold-light); font-size:10px; }
.goldRule::before,.goldRule::after { content:""; width:31px; height:1px; background:rgba(231,199,140,.6); margin:0 8px; }
.pageFoot { color:#a29582; font-family:Georgia,serif; font-size:10px; letter-spacing:.12em; text-align:center; margin:14px 0 0; }
.success { text-align:center; padding:64px 28px 66px; }
.successIcon { display:grid; place-items:center; width:69px; height:69px; margin:0 auto 22px; border-radius:50%; background:#f8edda; color:var(--gold); border:1px solid #e8d2a9; font-size:33px; font-weight:700; }
.success .eyebrow { justify-content:center; }
.success p { color:var(--muted); margin:10px 0 0; }
.secondary { margin-top:26px; border:1px solid var(--line); background:#fff; color:var(--navy); }
.secondary:hover { background:#faf4e9; }
.hidden { display:none !important; }
@media(max-width:380px) { .page { padding:12px 9px 15px; } .experience { border-radius:20px; } .brandBar { padding:13px 17px; } .brandTag { font-size:9px; } .hero { height:132px; } .formContent { padding:18px 21px 20px; } .subtitle { margin-bottom:15px; } .field { margin-bottom:9px; } }