.website-hero { min-height: 650px; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 7vw; padding-block: 5rem 7rem; }
.website-hero h1 { font-size: clamp(3.2rem, 6vw, 6rem); }
.ai-composer { max-width: 720px; padding: .75rem; background: white; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 18px 50px rgba(7,19,17,.1); }
.ai-composer label { display: block; padding: .3rem .45rem; color: var(--green); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.ai-composer textarea { width: 100%; padding: .7rem .45rem; resize: vertical; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 1rem; line-height: 1.5; }
.prompt-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .45rem 0 0 .45rem; border-top: 1px solid var(--line); }
.prompt-actions > span { color: var(--ink-soft); font-size: .68rem; }
.prompt-actions .button { min-height: 44px; padding: .6rem 1rem; }
.prompt-examples { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.prompt-examples button { padding: .45rem .7rem; color: var(--ink-soft); background: transparent; border: 1px solid var(--line); border-radius: 99px; cursor: pointer; font-size: .68rem; }
.prompt-examples button:hover { color: var(--green); border-color: var(--green); }
.launch-console { overflow: hidden; color: white; background: #091815; border: 1px solid #29443c; border-radius: 18px; box-shadow: 0 35px 90px rgba(7,19,17,.24); }
.console-top, .console-footer { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; color: #a9bbb5; background: #0d211c; font-size: .66rem; }
.console-top span { display: flex; align-items: center; gap: .5rem; color: white; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.console-top i { width: 7px; height: 7px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 0 5px rgba(210,255,114,.1); }
.business-summary { display: flex; flex-direction: column; padding: 1.5rem 1.3rem; background: radial-gradient(circle at 90% 0,rgba(143,224,189,.18),transparent 45%); }
.business-summary small { color: var(--mint); font-size: .6rem; text-transform: uppercase; letter-spacing: .1em; }
.business-summary strong { margin: .35rem 0 .1rem; font: 700 1.6rem "Manrope",sans-serif; letter-spacing: -.04em; }
.business-summary span { color: #9fb2ac; font-size: .72rem; }
.launch-stack { padding: 0 1.2rem 1.2rem; }
.launch-stack article { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: .8rem; margin-top: .65rem; padding: .85rem; border: 1px solid #29443c; border-radius: 9px; opacity: .68; transition: .35s ease; }
.launch-stack article.configured { opacity: 1; border-color: #4b776a; background: rgba(143,224,189,.06); transform: translateX(-4px); }
.stack-icon { display: grid; place-items: center; width: 32px; height: 32px; color: var(--lime); background: #17332b; border-radius: 7px; font-weight: 800; }
.launch-stack article div { display: flex; flex-direction: column; }
.launch-stack strong { font-size: .77rem; }
.launch-stack small { color: #94a9a2; font-size: .61rem; }
.launch-stack b { color: #5f766f; font-size: .58rem; }
.console-footer strong { color: var(--lime); }
.domain-section { padding-block: 8rem; color: white; background: var(--ink); }
.domain-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 7vw; align-items: start; }
.domain-copy h2 { margin: 0; font-size: clamp(2.4rem,4.5vw,4.2rem); line-height: 1.03; letter-spacing: -.055em; }
.domain-copy > p:not(.eyebrow) { color: #b9cac4; }
.domain-copy ul { display: grid; grid-template-columns: repeat(2,1fr); gap: .6rem; padding: 0; list-style: none; color: #d5e0dc; font-size: .76rem; }
.domain-copy li::before { content: "✓"; margin-right: .5rem; color: var(--lime); font-weight: 800; }
.domain-finder { padding: 1.5rem; color: var(--ink); background: white; border-radius: 14px; box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.domain-tabs { display: flex; gap: .4rem; padding: .3rem; margin-bottom: 1.3rem; background: #edf1ef; border-radius: 8px; }
.domain-tabs button { flex: 1; padding: .65rem; color: var(--ink-soft); background: transparent; border: 0; border-radius: 6px; cursor: pointer; font-size: .72rem; font-weight: 800; }
.domain-tabs button.active { color: var(--green-dark); background: white; box-shadow: 0 3px 12px rgba(7,19,17,.08); }
.domain-finder label { display: block; margin-bottom: .4rem; font-size: .72rem; font-weight: 800; }
.domain-search { display: grid; grid-template-columns: 1fr auto; gap: .6rem; }
.domain-search input { min-width: 0; padding: .8rem; border: 1px solid #bdcac5; border-radius: 6px; }
.domain-search .button { min-height: 46px; padding: .6rem 1rem; }
.domain-help { margin: .65rem 0; color: var(--ink-soft); font-size: .68rem; }
.domain-results { display: grid; gap: .45rem; }
.domain-results article { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .8rem; border: 1px solid var(--line); border-radius: 7px; }
.domain-results article > div { display: flex; flex-direction: column; min-width: 0; }
.domain-results strong { overflow: hidden; text-overflow: ellipsis; }
.domain-results small { color: var(--ink-soft); font-size: .6rem; }
.domain-results button, .selected-domain button { padding: .45rem .65rem; color: var(--green); background: #e8f6ef; border: 0; border-radius: 5px; cursor: pointer; font-size: .68rem; font-weight: 800; }
.domain-results button:disabled { color: #77827e; background: #eef1ef; cursor: not-allowed; }
.domain-results article[data-availability="available"] small { color: var(--green); font-weight: 800; }
.domain-results article[data-availability="unavailable"] { opacity: .78; }
.selected-domain[hidden] { display: none; }
.selected-domain { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .8rem; margin-top: 1rem; padding: .8rem; color: white; background: var(--green-dark); border-radius: 8px; }
.selected-domain > span { color: var(--mint); font-size: .6rem; text-transform: uppercase; }
.selected-domain > div { display: flex; flex-direction: column; min-width: 0; }
.selected-domain > div small { color: #cfe9dd; font-size: .6rem; }
.selected-domain .selected-domain-actions { flex-direction: row; gap: .4rem; }
.selected-domain .selected-domain-actions [data-domain-checkout] { color: white; background: var(--green); }
.registry-note { margin: 1rem 0 0; color: var(--ink-soft); font-size: .62rem; }
.registry-note span { margin-right: .35rem; padding: .2rem .4rem; color: var(--green-dark); background: #dff5e9; border-radius: 99px; font-weight: 800; text-transform: uppercase; }
.recovery-section { padding-block: 8rem; background: #edf7f2; }
.recovery-heading { display: grid; grid-template-columns: 1.3fr .7fr; gap: 4rem; align-items: end; margin-bottom: 3rem; }
.recovery-heading h2 { max-width: 720px; margin: 0; font-size: clamp(2.5rem,5vw,4.5rem); line-height: 1; letter-spacing: -.055em; }
.recovery-heading > p { color: var(--ink-soft); }
.recovery-flow { display: grid; grid-template-columns: repeat(4,1fr); background: white; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.recovery-flow article { min-height: 310px; padding: 1.5rem; border-right: 1px solid var(--line); }
.recovery-flow article:last-child { border: 0; }
.flow-number { color: #7f928b; font-size: .65rem; }
.flow-icon { display: grid; place-items: center; width: 44px; height: 44px; margin: 2rem 0 1.5rem; color: white; background: var(--green); border-radius: 50%; }
.recovery-flow h3 { margin: 0 0 .7rem; font-size: 1rem; }
.recovery-flow p { color: var(--ink-soft); font-size: .8rem; }
.recovery-flow small { display: block; margin-top: 1.2rem; color: var(--green); font-size: .65rem; font-weight: 700; }
.recovery-result { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1.2rem; align-items: center; margin-top: 1rem; padding: 1.2rem 1.4rem; color: white; background: var(--ink); border-radius: 10px; }
.recovery-result > span { grid-row: 1/3; display: flex; align-items: center; gap: .5rem; color: var(--mint); font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.recovery-result i { width: 8px; height: 8px; background: var(--lime); border-radius: 50%; }
.recovery-result strong { font-family: "Manrope",sans-serif; }
.recovery-result small { color: #9eb0aa; }
.number-product { display: grid; grid-template-columns: 1fr 1.3fr auto; align-items: center; gap: 2rem; margin-top: 1rem; padding: 1.3rem; background: white; border: 1px solid var(--line); border-radius: 10px; }
.number-product > div { display: flex; align-items: center; gap: .8rem; }
.number-icon { display: grid; place-items: center; width: 42px; height: 42px; color: white; background: var(--green); border-radius: 9px; }
.number-product p { display: flex; flex-direction: column; margin: 0; }
.number-product p small { color: var(--ink-soft); font-size: .62rem; }
.number-product p strong { font: 800 1.15rem "Manrope",sans-serif; }
.number-product ul { display: grid; grid-template-columns: repeat(2,1fr); gap: .35rem 1rem; padding: 0; margin: 0; list-style: none; font-size: .68rem; }
.number-product li::before { content: "✓"; margin-right: .35rem; color: var(--green); font-weight: 800; }
.availability-pill { padding: .5rem .7rem; color: var(--green-dark); background: #e3f4eb; border-radius: 99px; font-size: .62rem; font-weight: 800; text-align: center; }
.launch-card { padding: 2.2rem; color: white; background: var(--ink); border-radius: 16px; box-shadow: var(--shadow); }
.launch-card > strong { display: block; max-width: 360px; margin: 1rem 0 1.5rem; font: 700 clamp(1.8rem,3vw,2.7rem)/1.1 "Manrope",sans-serif; letter-spacing: -.04em; }
.launch-badge, .plan-label { display: inline-block; padding: .35rem .65rem; color: var(--ink); background: var(--lime); border-radius: 99px; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.launch-card ul, .plan-card ul { padding: 0; margin: 0; list-style: none; }
.launch-card li { display: grid; grid-template-columns: 36px 1fr; gap: .8rem; padding: .85rem 0; border-top: 1px solid rgba(255,255,255,.14); color: #d7e2de; }
.launch-card li span { color: var(--mint); font-size: .7rem; }
.plans-section { padding-block: 7rem; color: white; background: var(--green-dark); }
.pricing-banner { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 1rem; margin: -1.5rem 0 2.5rem; padding: .8rem 1rem; color: #d4e4de; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 8px; font-size: .72rem; }
.pricing-banner span { padding: .3rem .55rem; color: var(--ink); background: var(--lime); border-radius: 99px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.pricing-banner p { margin: 0; }
.plan-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; align-items: stretch; }
.plan-card { position: relative; display: flex; flex-direction: column; padding: 2rem; color: var(--ink); background: var(--paper-bright); border-radius: 12px; }
.plan-card.featured { outline: 3px solid var(--lime); transform: translateY(-10px); }
.plan-label { position: absolute; right: 1rem; top: 1rem; font-size: .62rem; }
.plan-card > p { margin: 0 0 .4rem; color: var(--green); font-weight: 800; }
.plan-card h3 { display: flex; align-items: baseline; gap: .35rem; margin: 0; }
.plan-card h3 strong { font-size: 2.6rem; letter-spacing: -.06em; }
.plan-card h3 span, .plan-card > small { color: var(--ink-soft); }
.plan-card ul { flex: 1; padding-block: 1.2rem; }
.plan-card li { padding: .48rem 0; border-bottom: 1px solid var(--line); font-size: .85rem; }
.plan-card li::before { content: "✓"; margin-right: .55rem; color: var(--green); font-weight: 800; }
.pricing-note { max-width: 760px; margin: 1.5rem auto 0; color: #bed3cb; text-align: center; font-size: .75rem; }
.control-section { padding-block: 8rem; background: var(--paper); }
.control-heading { max-width: 900px; margin-bottom: 3rem; }
.control-heading h2, .faq-heading h2 { margin: 0; font-size: clamp(2.4rem,4.5vw,4.2rem); line-height: 1.03; letter-spacing: -.055em; }
.control-grid { display: grid; grid-template-columns: repeat(4,1fr); border-block: 1px solid var(--line); }
.control-grid article { min-height: 260px; padding: 1.7rem; border-right: 1px solid var(--line); }
.control-grid article:last-child { border: 0; }
.control-grid article > span { color: var(--green); font-size: .65rem; font-weight: 800; }
.control-grid h3 { margin: 3rem 0 .7rem; font-size: 1rem; }
.control-grid p { color: var(--ink-soft); font-size: .78rem; }
.local-strip { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem 1.3rem; padding-top: 1.5rem; color: var(--ink-soft); font-size: .7rem; }
.local-strip strong { color: var(--green); text-transform: uppercase; letter-spacing: .07em; }
.faq-section { display: grid; grid-template-columns: .75fr 1.25fr; gap: 7vw; padding-block: 8rem; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list details:first-child { border-top: 1px solid var(--line); }
.faq-list summary { padding: 1.3rem .2rem; cursor: pointer; font: 700 .95rem "Manrope",sans-serif; }
.faq-list details p { margin: -.4rem 0 1.3rem; color: var(--ink-soft); font-size: .82rem; }
.faq-list summary::marker { color: var(--green); }
.builder-section { padding-block: 8rem; }
.builder-heading { max-width: 720px; margin-bottom: 3rem; }
.builder-heading h2 { margin: 0; font-size: clamp(2.5rem,5vw,4.5rem); line-height: 1; letter-spacing: -.055em; }
.builder-heading > p:last-child { color: var(--ink-soft); }
.builder-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(400px,.9fr); gap: 4rem; align-items: start; }
.builder-form { display: grid; gap: 1rem; }
.builder-form fieldset { margin: 0; padding: 1.5rem; border: 1px solid var(--line); border-radius: 10px; background: white; }
.builder-form legend { padding: 0 .5rem; font: 700 1rem "Manrope",sans-serif; }
.builder-form legend span { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: .45rem; color: white; background: var(--green); border-radius: 50%; font-size: .7rem; }
.builder-form label { display: flex; flex-direction: column; gap: .35rem; margin-bottom: .9rem; font-size: .76rem; font-weight: 700; }
.builder-form label, .builder-form input, .builder-form select, .builder-form textarea { min-width: 0; }
.builder-form input, .builder-form select, .builder-form textarea { width: 100%; max-width: 100%; padding: .78rem .82rem; color: var(--ink); background: white; border: 1px solid #cdd5d0; border-radius: 5px; }
.builder-form textarea { resize: vertical; }
.builder-form .optional { color: #71807b; font-weight: 400; }
.template-options { display: grid; grid-template-columns: repeat(3,1fr); gap: .7rem; }
.template-options label { cursor: pointer; }
.template-options input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.template-options span { padding: 1rem; border: 1px solid var(--line); border-radius: 7px; }
.template-options b, .template-options small { display: block; }
.template-options small { color: var(--ink-soft); font-weight: 400; }
.template-options input:checked + span { border-color: var(--green); box-shadow: inset 0 0 0 2px var(--green); background: #eff9f4; }
.template-options input:focus-visible + span { outline: 3px solid rgba(11,110,84,.28); outline-offset: 3px; }
.builder-form .consent { flex-direction: row; align-items: flex-start; font-weight: 400; }
.builder-form .consent input { width: auto; margin-top: .3rem; }
.service-selector { margin: 0 0 1.2rem; padding: 1rem; background: #eff8f3; border: 1px solid #cfe5da; border-radius: 8px; }
.service-selector > p { margin: 0 0 .7rem; color: var(--green); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.builder-form .service-selector label { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: .7rem; margin: 0; padding: .65rem 0; border-top: 1px solid #d5e7de; cursor: pointer; }
.builder-form .service-selector input { width: auto; margin-top: .25rem; }
.service-selector b, .service-selector small { display: block; }
.service-selector small { color: var(--ink-soft); font-weight: 400; }
.builder-form .honeypot { position: absolute; left: -9999px; }
.preview-wrap { position: sticky; top: 115px; }
.preview-label { display: flex; justify-content: space-between; margin-bottom: .6rem; color: var(--ink-soft); font-size: .72rem; }
.preview-label span { font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.site-preview { min-height: 510px; overflow: hidden; background: white; border: 8px solid var(--ink); border-radius: 14px; box-shadow: var(--shadow); transition: .2s ease; }
.site-preview header { display: flex; align-items: center; justify-content: space-between; padding: 1.1rem 1.3rem; }
.site-preview header strong { max-width: 60%; font: 800 .9rem "Manrope",sans-serif; }
.site-preview button { padding: .55rem .75rem; border: 0; border-radius: 4px; font-size: .65rem; font-weight: 800; }
.preview-hero { min-height: 370px; padding: 4.5rem 2.2rem 2.5rem; }
.preview-hero > small { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.preview-hero h3 { max-width: 420px; margin: .6rem 0 1rem; font-size: clamp(2rem,4vw,3.5rem); line-height: .98; letter-spacing: -.055em; }
.preview-hero p { max-width: 390px; font-size: .78rem; }
.preview-hero > div { display: flex; gap: .7rem; margin-top: 1.4rem; }
.preview-hero b, .preview-hero > div span { padding: .65rem .8rem; border-radius: 4px; font-size: .65rem; }
.site-preview footer { display: grid; grid-template-columns: repeat(3,1fr); padding: 1rem; text-align: center; font-size: .58rem; font-weight: 700; }
.theme-confident .preview-hero { color: white; background: linear-gradient(135deg,var(--green-dark),var(--green)); }
.theme-confident button, .theme-confident .preview-hero b { color: var(--ink); background: var(--lime); }
.theme-confident .preview-hero > div span { border: 1px solid var(--mint); }
.theme-clean { border-color: #e2e8e5; }
.theme-clean .preview-hero { color: #10201d; background: linear-gradient(135deg,#fff,#e7f5ee); }
.theme-clean button, .theme-clean .preview-hero b { color: white; background: #126b59; }
.theme-clean .preview-hero > div span { border: 1px solid #8aa099; }
.theme-local { border-color: #342c25; font-family: Georgia,serif; }
.theme-local .preview-hero { color: #fffaf0; background: linear-gradient(135deg,#493b2f,#855f3e); }
.theme-local button, .theme-local .preview-hero b { color: #33291f; background: #e6c47e; }
.theme-local .preview-hero > div span { border: 1px solid #e6c47e; }
.preview-disclaimer { color: var(--ink-soft); font-size: .7rem; }
@media (max-width: 900px) { .website-hero, .builder-grid, .domain-grid, .recovery-heading, .number-product, .faq-section { grid-template-columns: 1fr; } .plan-grid { grid-template-columns: 1fr; } .control-grid, .recovery-flow { grid-template-columns: repeat(2,1fr); } .control-grid article:nth-child(2) { border-right: 0; } .control-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); } .recovery-flow article:nth-child(2) { border-right: 0; } .recovery-flow article:nth-child(-n+2) { border-bottom: 1px solid var(--line); } .plan-card.featured { transform: none; } .preview-wrap { position: static; } }
@media (max-width: 620px) { .website-hero { padding-block: 3rem 5rem; } .prompt-actions { align-items: stretch; flex-direction: column; padding-left: 0; } .pricing-banner { grid-template-columns: 1fr; } .domain-copy ul { grid-template-columns: 1fr; } .domain-search { grid-template-columns: 1fr; } .selected-domain { grid-template-columns: 1fr auto; } .selected-domain > span { grid-column: 1/-1; } .control-grid, .recovery-flow { grid-template-columns: 1fr; } .control-grid article, .recovery-flow article { border-right: 0; border-bottom: 1px solid var(--line); } .recovery-result { grid-template-columns: 1fr; } .recovery-result > span { grid-row: auto; } .builder-grid { gap: 2rem; } .builder-form .form-grid, .template-options { grid-template-columns: 1fr; } .site-preview { min-height: 460px; } .preview-hero { padding: 3.5rem 1.4rem 2rem; } }
