@font-face { font-family:'Bricolage Grotesque'; font-style:normal; font-weight:500 800; font-display:swap; src:url('fonts/bricolage.woff2') format('woff2'); }
@font-face { font-family:'Instrument Sans'; font-style:normal; font-weight:400 700; font-display:swap; src:url('fonts/instrument.woff2') format('woff2'); }

/* Same visual vocabulary as the approved standalone homepage. */
.name-page {
  --paper:#F3EFE7; --ink:#1C2628; --muted:#5E5A52; --line:#DDD5C7;
  --orange:#0A7381; --sage:#E8E2D6; --cream:#EFEAE0; --card:#FFFDF9;
  --display:'Bricolage Grotesque',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,sans-serif; --serif:var(--display);
  color:var(--ink); background:var(--paper); font:400 16px/1.5 var(--body);
}
.name-page [hidden] { display:none!important; }
.name-page .wrap { max-width:1280px; padding-inline:clamp(16px,4vw,48px); }
.name-page h1,.name-page h2 { font-family:var(--display); font-weight:700; letter-spacing:-.03em; line-height:1.05; }
.name-page h1 { font-weight:800; }
.name-page h3 { font-family:var(--body); font-weight:700; line-height:1.3; }
.name-page em { font:inherit; color:inherit; }
.name-page a:focus-visible,.name-page button:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.name-page .header { height:auto; min-height:0; padding-top:28px; padding-bottom:8px; flex-wrap:wrap; gap:16px; }
.name-page .header-wordmark { gap:7px; }
.name-page .header .aaa-brand-image { width:156px; height:auto; }
.name-page .wordmark-subtitle { font:500 10px/1.3 var(--body); letter-spacing:.035em; }
.name-page .header nav { display:flex; flex-wrap:wrap; gap:8px 28px; font-size:15px; font-weight:600; }
.name-page .header nav>a { display:inline-flex; align-items:center; }
.name-page .nav-partner { padding:0; border:0; font:inherit; border-radius:0; }
.name-page .nav-partner span { margin-left:7px; }
.name-page .header nav a:hover { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
.name-page .eyebrow { color:var(--orange); font:700 11px/1.5 var(--body); letter-spacing:.1em; }
.name-page .button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:13px 22px; border-radius:999px; font:700 14px/1.4 var(--body); }
.name-page .dark { color:var(--card); background:var(--ink); }
.name-page .dark:hover { color:#fff; background:#000; }
.name-page button:disabled { opacity:.55; cursor:wait; }

.name-hero { padding-top:48px; padding-bottom:64px; text-align:center; }
.name-eyebrow { display:none; }
.name-hero h1 { margin:0; font-size:clamp(44px,5vw,72px); white-space:normal; }
.name-lead { max-width:40ch; margin:22px auto 0; font-size:19px; line-height:1.5; color:#45423C; }
.name-search-area { max-width:840px; margin:36px auto 0; text-align:left; }
.name-input-label { display:block; font-size:14px; font-weight:600; margin-bottom:12px; }
.name-search-bar { display:flex; padding:8px; background:var(--card); border:1px solid var(--line); border-radius:22px; box-shadow:0 3px 12px rgba(40,30,20,.06); }
.name-search-bar:focus-within { border-color:var(--orange); outline:3px solid #85D3DC80; outline-offset:3px; }
.name-address { flex:1; display:flex; align-items:center; min-width:0; padding:0 22px 0 16px; }
.name-address input { appearance:none; width:100%; min-width:0; color:var(--ink); background:transparent; border:0; padding:17px 0; font:500 28px/1.3 var(--body); outline:none; }
.name-address input::placeholder { color:#8B857A; opacity:1; }
.name-extension { font:600 28px/1.3 var(--body); white-space:nowrap; color:var(--ink); }
.name-check { display:flex; align-items:center; justify-content:center; gap:10px; border-radius:999px; padding:16px 26px; min-height:64px; background:var(--ink); color:var(--card); font:700 15px/1.4 var(--body); }
.name-check:hover { background:#000; }
.name-check svg { width:20px; height:20px; }
.name-rules,.name-preview-note { color:var(--muted); font-size:12px; line-height:1.6; }
.name-rules { margin-top:12px; }
.name-error { margin-top:14px; color:#973D29; font-size:14px; }
.name-examples { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-top:24px; color:var(--muted); font-size:13px; }
.name-examples>div { display:flex; flex-wrap:wrap; gap:8px; }
.name-examples button,.name-alternatives button { border:1px solid var(--line); border-radius:999px; padding:9px 14px; min-height:40px; background:transparent; font:600 13px var(--body); color:var(--ink); }
.name-examples button span { color:var(--muted); }
.name-examples button:hover,.name-alternatives button:hover { background:var(--card); border-color:var(--orange); }
.name-preview-note { margin-top:22px; }
.name-how-link { display:inline-flex; align-items:center; gap:12px; margin-top:30px; font-size:14px; font-weight:600; }
.name-result { margin-top:26px; padding:28px; border:1px solid var(--line); background:var(--card); border-radius:22px; }
.name-result[data-state="available"] { border-color:#75B5BD; }
.name-result[data-state="taken"],.name-result[data-state="reserved"],.name-result[data-state="requested"] { background:var(--cream); }
.name-result-main { display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:18px; }
.name-result-main>div { min-width:0; }
.result-symbol { display:flex; justify-content:center; align-items:center; height:40px; border:1px solid #75B5BD; border-radius:50%; color:var(--orange); font-size:21px; align-self:flex-start; margin-top:4px; }
.result-status { font-size:12px; font-weight:600; color:var(--muted); }
.name-result h2 { margin-top:6px; font:700 27px/1.2 var(--display); letter-spacing:-.025em; overflow-wrap:anywhere; }
.name-result h2>span { color:var(--muted); }
.result-copy { margin-top:10px; font-size:14px; color:var(--muted); line-height:1.6; }
.name-result .button { white-space:nowrap; }
.name-alternatives { border-top:1px solid var(--line); margin-top:22px; padding-top:18px; font-size:13px; color:var(--muted); }
.name-alternatives>div { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.name-alternatives button { overflow-wrap:anywhere; max-width:100%; text-align:left; }
.name-sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }

.name-steps-section { background:var(--paper); border-block:1px solid var(--line); padding:56px 0; }
.name-page .name-steps-section .section-head { margin-bottom:32px; gap:20px 40px; }
.name-steps-section h2,.name-existing h2 { font-size:clamp(32px,3.4vw,46px); }
.name-page .section-head>p { max-width:34ch; color:#45423C; font-size:16px; line-height:1.6; }
.name-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.name-step-number { display:none; }
.name-steps h3 { font-size:19px; margin-top:0; }
.name-steps p { color:var(--muted); font-size:15px; line-height:1.65; margin-top:10px; }
.name-apply-note { display:flex; align-items:flex-start; gap:16px; border-top:1px solid var(--line); padding-top:24px; margin-top:32px; }
.name-apply-note>span { color:var(--orange); font-size:24px; }
.name-apply-note p { color:var(--muted); font-size:13px; line-height:1.65; max-width:760px; }
.name-existing { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding-top:64px; padding-bottom:64px; }
.name-existing h2 { margin-top:16px; }
.name-existing>div>p:last-child { margin-top:22px; font-size:16px; color:var(--muted); }
.name-shop-cards { display:flex; justify-content:center; gap:20px; }
.name-shop-card { padding:8px; background:var(--card); box-shadow:0 2px 8px rgba(40,30,20,.08); border-radius:18px; width:220px; min-width:0; color:var(--ink); transition:transform .2s; }
.name-shop-card:hover { transform:translateY(-3px); color:var(--ink); }
.name-shop-photo { aspect-ratio:1/1.14; overflow:hidden; border-radius:10px; background:var(--cream); }
.name-shop-photo img { object-position:50% 20%; }
.name-shop-card>div:last-child { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 6px 8px; font-size:14px; font-weight:600; }
.name-shop-card>div>span>span { color:var(--muted); }
.name-page footer { border-top:1px solid var(--line); }
.name-page .footer-bottom>a { white-space:nowrap; }
.name-page .preview-note { color:var(--muted); }

.reservation-panel { margin-top:32px; padding:36px; border:1px solid var(--line); background:var(--card); border-radius:24px; scroll-margin-top:24px; }
.reservation-panel h2 { margin:12px 0 20px; font-size:clamp(28px,3vw,40px); line-height:1.15; overflow-wrap:anywhere; }
.reservation-panel h2 span { display:block; color:var(--orange); }
.reservation-panel>p { color:var(--muted); font-size:15px; max-width:650px; }
.reservation-fields { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:28px; }
.reservation-fields label { display:flex; flex-direction:column; gap:8px; min-width:0; font-size:14px; font-weight:600; }
.reservation-fields input,.reservation-fields textarea,.reservation-fields select { width:100%; min-height:48px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink); padding:12px; font:400 16px/1.5 var(--body); }
.reservation-fields input:focus,.reservation-fields textarea:focus,.reservation-fields select:focus { border-color:var(--orange); outline:3px solid #85D3DC80; outline-offset:2px; }
.reservation-fields textarea { resize:vertical; min-height:120px; }
.reservation-fields small { font-size:11px; font-weight:400; color:var(--muted); }
.reservation-wide { grid-column:1/-1; }
.reservation-consent { display:flex; align-items:flex-start; gap:12px; font-size:13px; line-height:1.65; margin-top:26px; }
.reservation-consent input { flex:0 0 19px; width:19px; height:19px; margin-top:3px; accent-color:var(--orange); }
.reservation-privacy,.reservation-footnote { color:var(--muted); font-size:12px; line-height:1.65; margin-top:15px; }
.reservation-panel .button { margin-top:22px; }
.reservation-honey { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.reservation-check { display:block; font-size:32px; color:var(--orange); margin:20px 0; }
#reservation-success p { margin-top:18px; font-size:15px; }
#reservation-reference { overflow-wrap:anywhere; color:var(--muted); font-size:12px!important; }

@media(max-width:900px) {
  .name-result-main { grid-template-columns:40px minmax(0,1fr); }
  .name-result-main>.button { grid-column:2; justify-self:start; }
  .name-steps { gap:26px; }
  .name-existing { gap:32px; }
  .name-shop-cards { gap:16px; }
  .name-shop-card>div:last-child { font-size:12px; }
}
@media(max-width:600px) {
  .name-page .header nav { flex-basis:100%; }
  .name-page .header nav>a:not([aria-current]) { display:inline-flex; }
  .name-page .header .nav-partner { padding:0; font:inherit; }
  .name-hero { padding-top:40px; padding-bottom:48px; }
  .name-hero h1 { font-size:clamp(36px,11.3vw,44px); }
  .name-lead { font-size:17px; }
  .name-search-area { margin-top:28px; }
  .name-search-bar { flex-wrap:wrap; gap:4px; padding:6px; border-radius:20px; }
  .name-address { flex-basis:100%; padding:0 12px; }
  .name-address input,.name-extension { font-size:23px; }
  .name-check { width:100%; min-height:48px; padding:12px 20px; font-size:14px; }
  .name-examples { margin-top:22px; gap:10px; font-size:12px; }
  .name-examples>div { gap:6px; }
  .name-examples button { font-size:12px; }
  .name-result { padding:22px 16px; }
  .name-result-main { grid-template-columns:30px minmax(0,1fr); gap:13px; }
  .result-symbol { height:30px; font-size:17px; }
  .name-result h2 { font-size:24px; }
  .name-result-main>.button { white-space:normal; max-width:100%; }
  .name-steps-section { padding:40px 0; }
  .name-page .name-steps-section .section-head { display:block; margin-bottom:28px; }
  .name-page .name-steps-section .section-head>p { font-size:15px; margin-top:20px; }
  .name-steps { grid-template-columns:1fr; gap:24px; }
  .name-steps p { font-size:14px; }
  .name-existing { display:block; padding-top:48px; padding-bottom:48px; }
  .name-shop-cards { margin:28px 0 0; gap:14px; }
  .name-shop-card { padding:6px; }
  .name-shop-card>div:last-child { font-size:11px; padding:11px 2px 5px; }
  .name-page .footer-bottom>a { display:inline-block; margin-top:17px; }
  .reservation-panel { padding:26px 18px; }
  .reservation-fields { grid-template-columns:1fr; gap:18px; }
  .reservation-panel .button { width:100%; padding:15px 12px; font-size:13px; }
}
