.create-card { position: relative; z-index: 5; width: min(560px, 100%); }
.page { min-height: 1px; }
.page main { overflow: hidden; }

.wikiurl-hero {
    position: relative;
    padding: 60px 20px 52px;
    background:
        radial-gradient(circle at 78% 12%, rgba(37, 99, 235, .12), transparent 28%),
        radial-gradient(circle at 96% 32%, rgba(6, 182, 212, .11), transparent 25%),
        linear-gradient(180deg, #f7fbff 0%, #ffffff 82%);
}
.wikiurl-hero::before,
.wikiurl-hero::after { content: ""; position: absolute; pointer-events: none; border-radius: 999px; }
.wikiurl-hero::before { width: 520px; height: 520px; top: -360px; right: -160px; background: rgba(37,99,235,.055); }
.wikiurl-hero::after { width: 300px; height: 300px; bottom: -220px; left: -180px; background: rgba(6,182,212,.045); }
.hero-grid { position: relative; z-index: 2; width: min(1390px, 100%); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(560px, .94fr); align-items: center; gap: 38px; }
.hero-copy { position: relative; z-index: 3; padding-left: 18px; }
.badge, .section-kicker, .card-kicker { display: inline-flex; align-items: center; min-height: 32px; padding: 6px 17px; border: 1px solid #d5e9ff; border-radius: 999px; background: #eaf5ff; color: var(--wikiurl-blue); font-size: 12px; font-weight: 800; letter-spacing: .01em; }
.hero-copy h1 { max-width: 720px; margin: 23px 0 22px; color: #071126; font-size: clamp(52px, 5.1vw, 76px); line-height: .99; letter-spacing: -4.4px; font-weight: 850; }
.hero-copy h1 span { color: #1769ff; }
.hero-copy .subtitle { max-width: 640px; margin: 0; color: #526684; font-size: 18px; line-height: 1.55; }
.hero-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 34px; max-width: 700px; }
.benefit-item { min-width: 0; display: flex; align-items: flex-start; gap: 10px; padding: 0 20px; border-right: 1px solid #e7edf5; }
.benefit-item:first-child { padding-left: 0; }
.benefit-item:last-child { padding-right: 0; border-right: 0; }
.benefit-icon { flex: 0 0 32px; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; color: #1168f7; font-size: 24px; line-height: 1; font-weight: 900; }
.benefit-icon-safe { font-size: 29px; }
.benefit-icon-analytics { font-size: 28px; }
.benefit-icon-tools { font-size: 27px; }
.benefit-item strong, .benefit-item span:not(.benefit-icon) { display: block; }
.benefit-item strong { margin-bottom: 4px; color: #0f1c33; font-size: 13px; font-weight: 800; }
.benefit-item div > span { color: #667a98; font-size: 11px; line-height: 1.35; }

.hero-stage { position: relative; min-height: 505px; display: flex; align-items: center; justify-content: flex-start; padding-right: 110px; }

.create-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.create-card-header h2 { margin: 7px 0 0; color: #0d1830; font-size: 24px; letter-spacing: -.7px; }
.card-kicker { min-height: auto; padding: 0; border: 0; background: none; border-radius: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.card-mark { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: #eff6ff; color: #1269ff; font-size: 20px; font-weight: 900; }







.form-note { margin: 12px 0 0; color: #9aaac0; font-size: 11px; line-height: 1.5; text-align: center; }

.hero-art { position: absolute; z-index: 2; inset: 0 -50px 0 auto; width: 310px; pointer-events: none; }
.hero-art-glow { position: absolute; border-radius: 50%; filter: blur(2px); }
.hero-art-glow-one { width: 420px; height: 420px; top: 15px; right: -120px; background: rgba(31,134,255,.11); }
.hero-art-glow-two { width: 230px; height: 230px; top: 145px; right: 35px; background: rgba(0,190,239,.10); }
.hero-short-pill { position: absolute; z-index: 4; top: 54px; right: 4px; width: 270px; min-height: 62px; padding: 0 16px; display: flex; align-items: center; gap: 10px; border: 1px solid #e2eaf5; border-radius: 15px; background: rgba(255,255,255,.96); box-shadow: 0 17px 40px rgba(31,82,140,.12); color: #1d55b5; transform: rotate(3deg); }
.hero-short-pill span { color: #1682ff; font-size: 24px; font-weight: 900; }
.hero-short-pill strong { flex: 1; font-size: 14px; white-space: nowrap; }
.hero-short-pill b { color: #1269ff; font-size: 18px; }
.hero-preview-card { position: absolute; z-index: 3; top: 140px; right: 10px; width: 250px; padding: 10px 10px 12px; border: 1px solid #e2eaf5; border-radius: 20px; background: rgba(255,255,255,.95); box-shadow: 0 25px 55px rgba(24,83,142,.14); transform: rotate(6deg); overflow: hidden; }
.preview-image { position: relative; height: 150px; overflow: hidden; border-radius: 13px; background: linear-gradient(180deg,#92d9ff 0%,#c9efff 56%,#f2d7a6 57%,#77b66b 100%); }
.preview-sun { position: absolute; width: 35px; height: 35px; top: 25px; right: 32px; border-radius: 50%; background: #ffe9a5; box-shadow: 0 0 30px rgba(255,232,154,.9); }
.preview-mountain { position: absolute; bottom: -2px; width: 0; height: 0; border-left: 100px solid transparent; border-right: 100px solid transparent; border-bottom: 115px solid #4b6f8d; }
.preview-mountain-one { left: -42px; }
.preview-mountain-two { right: -35px; border-bottom-color: #285e83; border-bottom-width: 95px; }
.preview-body { padding: 10px 6px 0; color: #0d1830; }
.preview-body strong, .preview-body span { display: block; }
.preview-body strong { font-size: 13px; margin-bottom: 3px; }
.preview-body span { color: #71829c; font-size: 9px; }
.preview-body i { display: block; height: 5px; width: 80%; margin-top: 8px; border-radius: 8px; background: #e6edf6; }
.preview-body i + i { width: 58%; margin-top: 5px; }
.preview-socials { display: flex; gap: 7px; margin-top: 11px; }
.preview-socials b { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #f2f6fb; color: #1269ff; font-size: 10px; }
.hero-arrow { position: absolute; right: -5px; bottom: 30px; color: #1269ff; font-size: 84px; line-height: 1; font-weight: 300; transform: rotate(-8deg); text-shadow: 0 12px 30px rgba(18,105,255,.12); }

.message { margin-bottom: 18px; padding: 13px 14px; border-radius: 10px; font-size: 13px; line-height: 1.5; }
.error { background: #fff1f2; border: 1px solid #fecdd3; color: #be123c; }
.success { background: #ecfdf3; border: 1px solid #abefc6; color: #067647; }
.verification-box { padding: 18px; border: 1px solid #dbeafe; border-radius: 14px; background: #f8fbff; }
.verification-box h3 { margin: 0 0 8px; font-size: 18px; color: #172033; }
.verification-box p { margin: 7px 0; color: #667085; font-size: 13px; line-height: 1.5; }
.verification-error { margin: 12px 0; padding: 11px; border-radius: 9px; background: #fff1f2; border: 1px solid #fecdd3; color: #be123c; font-size: 13px; }
.result { margin-top: 18px; padding: 17px; border: 1px solid #e4e7ec; border-radius: 13px; background: #f8fafc; }
.result-title { margin: 0 0 8px; color: #667085; font-size: 12px; font-weight: 750; }
.result-box { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; }
.result-url { flex: 1; min-width: 0; padding: 12px; overflow-wrap: anywhere; border: 1px solid #e4e7ec; border-radius: 9px; background: #fff; color: var(--wikiurl-blue); font-size: 14px; font-weight: 700; }
.copy-button { width: auto; min-width: 82px; min-height: 43px; padding: 0 13px; border: 0; border-radius: 9px; background: #172033; color: #fff; font-size: 12px; font-weight: 700; }
.copy-button:hover { background: #344054; }
.manage-link { display: inline-block; max-width: 100%; color: var(--wikiurl-blue); font-size: 13px; font-weight: 700; overflow-wrap: anywhere; text-decoration: none; }
.manage-link:hover { text-decoration: underline; }
.warning { margin: 10px 0 0; color: #667085; font-size: 11px; line-height: 1.5; }
.destination-warning { margin-top: 15px; padding: 13px 14px; border-radius: 11px; background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; font-size: 13px; line-height: 1.5; }
.destination-warning strong { display: block; margin-bottom: 6px; }
.destination-code { display: inline-block; margin-top: 7px; padding: 4px 7px; border-radius: 6px; background: #ffedd5; font-size: 11px; font-weight: 800; }
.destination-final { margin-top: 9px; padding-top: 9px; border-top: 1px solid #fed7aa; }
.destination-final span { overflow-wrap: anywhere; }
.destination-warning p { margin: 9px 0 0; }

.tools-strip { width: min(1430px, calc(100% - 64px)); margin: -1px auto 0; position: relative; z-index: 6; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; }
.tool-card { min-width: 0; min-height: 130px; padding: 20px 17px; display: grid; grid-template-columns: 48px minmax(0,1fr) 18px; align-items: center; gap: 11px; border: 1px solid #e4eaf2; border-radius: 18px; background: rgba(255,255,255,.98); box-shadow: 0 14px 34px rgba(20,63,110,.07); }
.tool-icon { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; border-radius: 13px; font-size: 24px; font-weight: 900; }
.tool-blue .tool-icon { background: #e9f0ff; color: #2169ee; }
.tool-green .tool-icon { background: #dcfce7; color: #00a64f; }
.tool-purple .tool-icon { background: #f0e8ff; color: #7c3aed; }
.tool-whatsapp .tool-icon { background: #dcfce7; color: #00a84f; }
.tool-orange .tool-icon { background: #fff0e8; color: #f97316; }
.tool-card h3 { margin: 0 0 5px; color: #0d1830; font-size: 14px; line-height: 1.2; }
.tool-card p { margin: 0; color: #687c99; font-size: 11px; line-height: 1.45; }
.tool-arrow { color: #0d1830; font-size: 28px; line-height: 1; }

.smart-section { width: min(1430px, calc(100% - 40px)); margin: 42px auto 24px; padding: 36px 50px; display: grid; grid-template-columns: .9fr 1.45fr; align-items: center; gap: 30px; border: 1px solid #e8eef5; border-radius: 24px; background: linear-gradient(110deg, #ffffff 0%, #f8fbff 100%); box-shadow: 0 12px 35px rgba(20,63,110,.035); }
.smart-copy .section-kicker { min-height: 30px; padding: 5px 16px; }
.smart-copy h2 { margin: 15px 0 0; color: #071126; font-size: clamp(30px, 3.3vw, 48px); line-height: 1.05; letter-spacing: -2px; }
.smart-copy h2::first-line { color: #071126; }
.smart-stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.smart-stat { min-height: 135px; padding: 18px 18px 16px; border: 1px solid #e7edf5; border-radius: 16px; background: #fff; }
.stat-icon { display: block; margin-bottom: 10px; color: #1269ff; font-size: 25px; line-height: 1; font-weight: 900; }
.stat-cyan { color: #12bfc5; }
.smart-stat strong, .smart-stat > span:last-child { display: block; }
.smart-stat strong { color: #0d1830; font-size: 23px; line-height: 1.1; }
.smart-stat > span:last-child { margin-top: 5px; color: #627795; font-size: 13px; }

@media (max-width: 1250px) {
    .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(490px, .9fr); gap: 20px; }
    .hero-stage { padding-right: 70px; }
    .hero-art { right: -25px; transform: scale(.88); transform-origin: right center; }
    .tools-strip { width: min(1120px, calc(100% - 40px)); grid-template-columns: repeat(3, minmax(0,1fr)); }
    .smart-section { width: min(1120px, calc(100% - 40px)); grid-template-columns: 1fr; }
}

@media (max-width: 1050px) {
    .hero-copy h1 { font-size: clamp(48px, 6vw, 66px); }
    .hero-benefits { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 0; }
    .benefit-item:nth-child(2) { border-right: 0; }
    .benefit-item:nth-child(3) { padding-left: 0; }
}

@media (max-width: 980px) {
    .wikiurl-hero { padding-top: 48px; }
    .hero-grid { grid-template-columns: 1fr; gap: 20px; }
    .hero-copy { padding-left: 0; }
    .hero-stage { min-height: auto; padding: 0; justify-content: center; }
    .create-card { width: min(680px, 100%); }
    .hero-art { display: none; }
    .tools-strip { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .smart-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 650px) {
    .wikiurl-hero { padding: 34px 12px 42px; }
    .hero-copy h1 { font-size: 45px; letter-spacing: -2.5px; }
    .hero-copy .subtitle { font-size: 16px; }
    .hero-benefits { grid-template-columns: 1fr; gap: 12px; }
    .benefit-item, .benefit-item:first-child, .benefit-item:nth-child(3) { padding: 0; border-right: 0; }
    .create-card { padding: 22px 18px; border-radius: 18px; }
    .tools-strip { width: calc(100% - 24px); grid-template-columns: 1fr; }
    .smart-section { width: calc(100% - 24px); padding: 28px 20px; }
    .smart-stats { grid-template-columns: 1fr 1fr; }
    .result-box { flex-direction: column; align-items: stretch; }
    .copy-button { width: 100%; }
}

.tool-card { color: inherit; text-decoration: none; }
a.tool-card:hover, a.tool-card:focus-visible { border-color: var(--wikiurl-blue); }
a.tool-card:focus-visible { outline: 2px solid var(--wikiurl-blue); outline-offset: 4px; }