/* Design tokens. Source: claude.ai/design project 1c8a521e, "acaeet Coming Soon.dc.html" (fetched 2026-09-14, second version). */
:root {
  --ac-bg: #4E5D52;
  --ac-fg: #ffffff;
  --ac-cream: #F2E2C7;
  --ac-placeholder: #C4CEC0;
  --ac-fg-70: rgba(255,255,255,.7);
  --ac-fg-88: rgba(255,255,255,.88);
  --ac-line-40: rgba(255,255,255,.4);
  --ac-glow: rgba(255,255,255,.085);
  --ac-glow-warm: rgba(242,226,199,.17);
  --ac-glow-warm-0: rgba(242,226,199,0);
  --ac-badge-ring: rgba(242,226,199,.45);
  --ac-badge-line: rgba(242,226,199,.55);
  --ac-disc-line: rgba(255,255,255,.035);
  --ac-disc-fill: rgba(169,190,150,.04);
  --ac-arc-1: rgba(247,238,221,.06);
  --ac-arc-1b: rgba(247,238,221,.02);
  --ac-arc-2: rgba(247,238,221,.045);
  --ac-arc-3: rgba(247,238,221,.035);
  --ac-font: Jost, 'Century Gothic', system-ui, sans-serif;
  --ac-ease-out: cubic-bezier(.2,.7,.2,1);
  --ac-ease-rise: cubic-bezier(.16,1,.3,1);
  --ac-hover-opacity: .6;
  --ac-small: clamp(11px,1vw,13px);
  --ac-icon: clamp(18px,min(2.4vw,2.8vh),28px);
  /* Phrase rotation interval (design prop cycleSeconds = 2.8). ac-phrase-cycle keyframes assume 3 phrases. */
  --ac-phrase-cycle: 2.8s;
}

@font-face { font-family: Jost; font-style: normal; font-weight: 300 600; font-display: swap;
  src: url(fonts/jost-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: Jost; font-style: normal; font-weight: 300 600; font-display: swap;
  src: url(fonts/jost-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

html, body { margin:0; padding:0; background:var(--ac-bg); }
* { box-sizing:border-box; }
a { color:var(--ac-fg); text-decoration:none; }
a:hover { color:var(--ac-fg); opacity:var(--ac-hover-opacity); }
input:focus { outline:none; }
input::placeholder { color:var(--ac-placeholder); }
[hidden] { display:none !important; }

@keyframes ac-rise { from { opacity:0; transform:translateY(.42em); filter:blur(10px); } to { opacity:1; transform:translateY(0); filter:blur(0); } }
@keyframes ac-fade { from { opacity:0; transform:translateY(10px); filter:blur(6px); } to { opacity:1; transform:translateY(0); filter:blur(0); } }
@keyframes ac-beat { 0%,100% { transform:scale(1); } 14% { transform:scale(1.22); } 28% { transform:scale(1); } 42% { transform:scale(1.14); } 60% { transform:scale(1); } }
@keyframes ac-drift { 0% { transform:translate3d(-8%,-6%,0) scale(1); } 50% { transform:translate3d(10%,8%,0) scale(1.18); } 100% { transform:translate3d(-8%,-6%,0) scale(1); } }
@keyframes ac-float { 0%,100% { transform:translateY(0) rotate(0deg); } 50% { transform:translateY(-.055em) rotate(-.6deg); } }
@keyframes ac-breathe { 0%,100% { transform:scale(1); opacity:.85; } 50% { transform:scale(1.06); opacity:1; } }
@keyframes ac-ring { 0% { transform:scale(.85); opacity:.55; } 100% { transform:scale(1.7); opacity:0; } }
@keyframes ac-spin { to { transform:rotate(360deg); } }
@keyframes ac-spin-rev { to { transform:rotate(-360deg); } }
@keyframes ac-disc { 0%,100% { transform:scale(1); } 50% { transform:scale(1.035); } }
@keyframes ac-appear { from { opacity:0; transform:translate(-50%,-50%) scale(.92); } to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
/* The design's ac-swap (.85s, from opacity 0 / translateY 14px / blur 7px) replayed once per phrase slot,
   in CSS instead of a script. One period = 3 slots = 8.4s: swap in 0–10.119% (.85s), hold to 33.333%, then hidden. */
@keyframes ac-phrase-cycle {
  0% { opacity:0; transform:translateY(14px); filter:blur(7px); animation-timing-function:cubic-bezier(.16,1,.3,1); }
  10.119% { opacity:1; transform:translateY(0); filter:blur(0); }
  33.333% { opacity:1; transform:translateY(0); filter:blur(0); animation-timing-function:steps(1,end); }
  33.334%, 100% { opacity:0; transform:translateY(0); filter:blur(0); }
}

.ac-page { position:relative; min-height:100svh; width:100%; overflow:hidden; background:var(--ac-bg); color:var(--ac-fg); font-family:var(--ac-font); display:flex; flex-direction:column; padding:clamp(18px,min(3.4vw,3.4vh),44px); padding-bottom:max(clamp(18px,3.4vh,44px), env(safe-area-inset-bottom)); gap:clamp(12px,2vh,24px); }
.ac-glow { position:absolute; inset:-20%; pointer-events:none; background:radial-gradient(closest-side, var(--ac-glow), rgba(255,255,255,0) 70%); animation:ac-drift 34s ease-in-out infinite; }
.ac-glow-warm { position:absolute; top:-26%; left:50%; width:min(120vw,1100px); height:min(120vw,1100px); transform:translateX(-50%); pointer-events:none; background:radial-gradient(closest-side, var(--ac-glow-warm), var(--ac-glow-warm-0) 72%); }

.ac-header { position:relative; display:flex; justify-content:center; opacity:0; animation:ac-fade 1.1s .1s var(--ac-ease-out) forwards; }
.ac-badge { position:relative; display:flex; align-items:center; justify-content:center; width:clamp(42px,min(5.6vw,6.4vh),68px); height:clamp(42px,min(5.6vw,6.4vh),68px); }
.ac-badge__ring { position:absolute; inset:0; border:1px solid var(--ac-badge-ring); border-radius:50%; animation:ac-ring 4.2s ease-out infinite; }
.ac-badge__line { position:absolute; inset:0; border:1px solid var(--ac-badge-line); border-radius:50%; animation:ac-breathe 4.2s ease-in-out infinite; }
.ac-badge__mark { font-size:var(--ac-icon); line-height:1; color:var(--ac-cream); padding-bottom:.18em; animation:ac-breathe 4.2s ease-in-out infinite; }

.ac-main { position:relative; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:clamp(12px,min(2.4vw,2.6vh),30px); text-align:center; padding:clamp(24px,7vh,90px) 0 8px; }
.ac-title-wrap { position:relative; display:flex; align-items:center; justify-content:center; width:100%; }

.ac-disc { position:absolute; left:50%; top:50%; width:min(86vmin,760px); height:min(86vmin,760px); transform:translate(-50%,-50%); pointer-events:none; opacity:0; animation:ac-appear 1.6s .3s var(--ac-ease-rise) forwards; }
.ac-disc > div { position:absolute; border-radius:50%; }
.ac-disc__edge { inset:0; border:1px solid var(--ac-disc-line); }
.ac-disc__fill { inset:5%; background:var(--ac-disc-fill); animation:ac-disc 9s ease-in-out infinite; }
.ac-disc__arc1 { inset:5%; border:2px solid transparent; border-top-color:var(--ac-arc-1); border-right-color:var(--ac-arc-1b); animation:ac-spin 22s linear infinite; }
.ac-disc__arc2 { inset:17%; border:2px solid transparent; border-top-color:var(--ac-arc-2); animation:ac-spin-rev 30s linear infinite; }
.ac-disc__arc3 { inset:30%; border:2px solid transparent; border-top-color:var(--ac-arc-3); animation:ac-spin 40s linear infinite; }

.ac-title { position:relative; margin:0; font-weight:500; letter-spacing:-.035em; line-height:.9; font-size:clamp(56px,min(17vw,24vh),240px); display:flex; align-items:baseline; justify-content:center; }
.ac-title span { display:inline-block; opacity:0; }
.ac-title span:nth-child(1) { animation:ac-rise 1.15s .18s var(--ac-ease-rise) forwards, ac-float 7s 1.6s ease-in-out infinite; }
.ac-title span:nth-child(2) { animation:ac-rise 1.15s .28s var(--ac-ease-rise) forwards, ac-float 7s 1.9s ease-in-out infinite; }
.ac-title span:nth-child(3) { animation:ac-rise 1.15s .38s var(--ac-ease-rise) forwards, ac-float 7s 2.2s ease-in-out infinite; }
.ac-title span:nth-child(4) { animation:ac-rise 1.15s .48s var(--ac-ease-rise) forwards, ac-float 7s 2.5s ease-in-out infinite; }
.ac-title span:nth-child(5) { animation:ac-rise 1.15s .58s var(--ac-ease-rise) forwards, ac-float 7s 2.8s ease-in-out infinite; }
.ac-title span:nth-child(6) { animation:ac-rise 1.15s .68s var(--ac-ease-rise) forwards, ac-float 7s 3.1s ease-in-out infinite; }

/* Grid stacks the three phrases in one cell; the fixed track keeps the design's centring when the text is taller than the row. */
.ac-phrase-row { height:clamp(28px,min(4.6vw,6vh),62px); display:grid; grid-template:minmax(0,1fr) / minmax(0,1fr); place-items:center; width:100%; opacity:0; animation:ac-fade 1s 1.05s var(--ac-ease-out) forwards; }
.ac-phrase { grid-area:1 / 1; display:inline-block; font-size:clamp(22px,min(4.2vw,5.4vh),56px); font-weight:400; letter-spacing:-.02em; animation:ac-phrase-cycle calc(var(--ac-phrase-cycle) * 3) linear infinite both; }
.ac-phrase:nth-child(2) { animation-delay:var(--ac-phrase-cycle); }
.ac-phrase:nth-child(3) { animation-delay:calc(var(--ac-phrase-cycle) * 2); }

.ac-heart { position:relative; font-size:var(--ac-icon); line-height:1; display:inline-block; opacity:0; animation:ac-fade 1s 1.35s var(--ac-ease-out) forwards, ac-beat 2.8s 2.4s ease-in-out infinite; }

.ac-footer { position:relative; display:flex; flex-direction:column; gap:clamp(12px,min(2.4vw,2.2vh),28px); opacity:0; animation:ac-fade 1s 1.6s var(--ac-ease-out) forwards; }

.ac-form { display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; }
.ac-form label { font-size:var(--ac-small); letter-spacing:.22em; text-transform:uppercase; color:var(--ac-cream); }
.ac-field { display:flex; align-items:center; gap:12px; width:min(420px,100%); border-bottom:1px solid var(--ac-line-40); padding:8px 2px; }
.ac-field input { flex:1; min-width:0; background:transparent; border:none; color:var(--ac-fg); font-family:inherit; font-size:16px; letter-spacing:.01em; padding:8px 0; min-height:44px; }
.ac-field button { background:none; border:none; color:var(--ac-fg); font-family:inherit; font-size:clamp(15px,1.5vw,18px); letter-spacing:.12em; text-transform:uppercase; cursor:pointer; padding:8px 4px; min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; }
.ac-field button:hover { opacity:var(--ac-hover-opacity); }
.ac-note { font-size:12px; letter-spacing:.04em; color:var(--ac-fg); min-height:16px; }
/* Consent line: approved addition to the design (plan 2026-09-14): 12px, white 70%. */
.ac-consent { margin:0; max-width:min(420px,100%); font-size:12px; line-height:1.5; letter-spacing:.04em; color:var(--ac-fg-70); text-align:center; }
.ac-consent a { text-decoration:underline; text-underline-offset:2px; }
/* Honeypot: off-screen, not display:none, so simple bots still fill it. */
.ac-hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }

.ac-tags { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px clamp(12px,2.4vw,26px); font-size:clamp(10px,min(1.05vw,1.5vh),13px); letter-spacing:.2em; text-transform:uppercase; color:var(--ac-cream); text-align:center; }
.ac-tags__dot { width:4px; height:4px; border-radius:50%; background:var(--ac-cream); }

/* Legal pages */
.ac-legal { max-width:720px; margin:0 auto; padding:clamp(20px,3.4vw,44px); color:var(--ac-fg); font-family:var(--ac-font); line-height:1.6; }
.ac-legal h1 { font-weight:500; letter-spacing:-.02em; }
.ac-legal h2 { font-weight:500; font-size:1.1em; margin-top:2em; }
.ac-legal a { text-decoration:underline; }
.ac-gap { border:1px dashed var(--ac-line-40); padding:12px 16px; color:var(--ac-fg-88); }
