:root {
            --slu-orange:        #E8501A;
            --slu-orange-hover:  #C94010;
            --slu-orange-light:  #F4773A;
            --slu-orange-muted:  rgba(232, 80, 26, 0.10);
            --slu-orange-border: rgba(232, 80, 26, 0.30);
            --slu-green:         #2D6A2D;
            --slu-green-hover:   #1F4D1F;
            --slu-green-muted:   rgba(45, 106, 45, 0.10);
            --slu-dark:          #1A1A1A;
            --slu-dark-2:        #252525;
            --slu-mid:           #4A4A4A;
            --slu-subtle:        #7A7A7A;
            --slu-cream:         #F9F5EF;
            --slu-cream-dark:    #F2EDE6;
            --slu-border:        #DDD8CF;
            --slu-white:         #FFFFFF;

            --font-display: 'Syne', sans-serif;
            --font-body:    'DM Sans', sans-serif;

            --radius-sm: 6px;
            --radius-md: 10px;
            --radius-lg: 14px;

            --shadow-sm: 0 2px 8px rgba(0,0,0,0.07);
            --shadow-md: 0 4px 20px rgba(0,0,0,0.10);
            --shadow-lg: 0 12px 48px rgba(0,0,0,0.14);
        }

        *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }

        body {
            font-family: var(--font-body);
            background: var(--slu-cream);
            color: var(--slu-dark);
            line-height: 1.6;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            -webkit-font-smoothing: antialiased;
        }

        /* ── Topbar ──────────────────────────────────────────────────────── */
        .slu-topbar {
            background: var(--slu-dark);
            height: 56px;
            display: flex;
            align-items: center;
            padding: 0 clamp(16px, 4vw, 48px);
            position: sticky;
            top: 0;
            z-index: 50;
            border-bottom: 1px solid rgba(255,255,255,0.06);
        }
        .slu-topbar__logo {
            display: flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
        }
        .slu-topbar__emblem {
            width: 34px; height: 34px;
            background: var(--slu-orange);
            border-radius: 8px;
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0;
        }
        .slu-topbar__emblem svg { width: 18px; height: 18px; fill: white; }
        .slu-topbar__name {
            font-family: var(--font-display);
            font-weight: 800;
            font-size: 14px;
            color: white;
            letter-spacing: 0.5px;
            line-height: 1;
        }
        .slu-topbar__name small {
            display: block;
            font-family: var(--font-body);
            font-weight: 400;
            font-size: 11px;
            color: rgba(255,255,255,0.45);
            letter-spacing: 0;
            margin-top: 2px;
        }
        .slu-topbar__spacer { flex: 1; }
        .slu-topbar__back {
            font-size: 12px;
            font-weight: 500;
            color: rgba(255,255,255,0.45);
            text-decoration: none;
            display: flex; align-items: center; gap: 6px;
            transition: color .2s;
        }
        .slu-topbar__back:hover { color: var(--slu-orange-light); }
        .slu-topbar__back svg { width: 14px; height: 14px; fill: currentColor; }

        /* ── Hero ────────────────────────────────────────────────────────── */
        .slu-hero {
            background: var(--slu-dark);
            padding: 16px clamp(16px, 4vw, 48px);
            position: relative;
            overflow: hidden;
        }
        .slu-hero::after {
            content: '';
            position: absolute;
            top: -100px; right: -100px;
            width: 360px; height: 360px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(232,80,26,.20) 0%, transparent 70%);
            pointer-events: none;
        }
        .slu-hero__inner { max-width: 740px; position: relative; z-index: 1; }
        .slu-hero__tag {
            display: inline-flex; align-items: center; gap: 8px;
            background: var(--slu-orange);
            color: white;
            font-family: var(--font-display);
            font-size: 10px; font-weight: 700;
            letter-spacing: 2px; text-transform: uppercase;
            padding: 4px 12px; border-radius: 3px;
            margin-bottom: 16px;
        }
        .slu-hero__title {
            font-family: var(--font-display);
            font-size: clamp(16px, 2.5vw, 22px);
            font-weight: 800;
            color: white;
            line-height: 1.2;
            margin-bottom: 4px;
        }
        .slu-hero__subtitle {
            font-size: 14px;
            color: rgba(255,255,255,0.50);
            line-height: 1.5;
            max-width: 600px;
        }

        /* ── Main ────────────────────────────────────────────────────────── */
        .slu-main {
            flex: 1;
            padding: clamp(24px, 4vw, 48px) clamp(16px, 4vw, 48px);
            max-width: 900px;
            width: 100%;
            margin: 0 auto;
        }

        /* ── Card ────────────────────────────────────────────────────────── */
        .slu-card {
            background: var(--slu-white);
            border-radius: var(--radius-lg);
            border: 1px solid var(--slu-border);
            box-shadow: var(--shadow-md);
            overflow: hidden;
        }
        .slu-card__body { padding: clamp(20px, 4vw, 36px); }

        /* ── Info Banner ─────────────────────────────────────────────────── */
        .slu-info {
            display: flex; gap: 12px; align-items: flex-start;
            background: var(--slu-orange-muted);
            border-left: 3px solid var(--slu-orange);
            border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
            padding: 14px 16px;
            margin-bottom: 24px;
            font-size: 13px; color: var(--slu-mid); line-height: 1.5;
        }
        .slu-info svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; fill: var(--slu-orange); }
        .slu-info strong { color: var(--slu-orange); }

        /* ── Fieldset / Fields ───────────────────────────────────────────── */
        .slu-fieldset { display: grid; gap: 18px; margin-bottom: 18px; }
        .slu-fieldset--2col { grid-template-columns: 1fr 1fr; }
        .slu-fieldset--3col { grid-template-columns: 1fr 1fr 1fr; }
        .slu-field { display: flex; flex-direction: column; gap: 6px; }

        .slu-label {
            font-size: 11px; font-weight: 600;
            color: var(--slu-dark);
            text-transform: uppercase; letter-spacing: 0.6px;
        }
        
        .slu-label__req { color: var(--slu-orange); margin-left: 2px; }
        .slu-label__hint {
            display: block;
            font-size: 11px; font-weight: 400;
            text-transform: none; letter-spacing: 0;
            color: var(--slu-subtle); margin-top: 2px;
        }

        .slu-input, .slu-select, .slu-textarea {
            font-family: var(--font-body);
            font-size: 14px; color: var(--slu-dark);
            background: var(--slu-cream);
            border: 1.5px solid var(--slu-border);
            border-radius: var(--radius-sm);
            padding: 10px 14px; width: 100%;
            transition: border-color .18s, box-shadow .18s, background .18s;
            outline: none; -webkit-appearance: none;
        }
        .slu-input::placeholder, .slu-textarea::placeholder { color: #B0AA9F; }
        .slu-input:focus, .slu-select:focus, .slu-textarea:focus {
            border-color: var(--slu-orange);
            background: white;
            box-shadow: 0 0 0 3px var(--slu-orange-muted);
        }
        .slu-input.is-invalid, .slu-select.is-invalid, .slu-textarea.is-invalid {
            border-color: #DC3545;
            box-shadow: 0 0 0 3px rgba(220,53,69,.10);
        }
        .slu-select {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A7A7A' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 14px center;
            padding-right: 38px; cursor: pointer;
        }
        .slu-textarea { resize: vertical; min-height: 96px; }

        .slu-error {
            font-size: 12px; color: #DC3545;
            display: flex; align-items: center; gap: 5px;
            margin-top: -2px;
        }
        .slu-error::before { content: '⚠'; font-size: 11px; }

        /* ── Radio ───────────────────────────────────────────────────────── */
        
        .slu-radio-group { 
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap; 
            justify-content: flex-start; 
            align-items: center;
            gap: 20px; 
            width: 100%;
            margin-bottom: 20px;
            margin-top: 8px;

        } 

        .slu-radio-option {
            display: flex; align-items: center; gap: 7px;
            padding: 8px 16px;
            border: 1.5px solid var(--slu-border);
            border-radius: var(--radius-sm);
            font-size: 13px; font-weight: 500; color: var(--slu-mid);
            cursor: pointer; background: var(--slu-cream);
            transition: all .18s; user-select: none;
        
        }
        .slu-radio-option input[type="radio"] { display: none; }
        .slu-radio-option:hover { border-color: var(--slu-orange); color: var(--slu-orange); }
        .slu-radio-option:has(input:checked) {
            background: var(--slu-orange-muted);
            border-color: var(--slu-orange);
            color: var(--slu-orange); font-weight: 600;
        }
        .slu-radio-dot {
            width: 14px; height: 14px; border-radius: 50%;
            border: 2px solid currentColor;
            display: flex; align-items: center; justify-content: center; flex-shrink: 0;
        }
        .slu-radio-option:has(input:checked) .slu-radio-dot::after {
            content: ''; width: 6px; height: 6px;
            border-radius: 50%; background: var(--slu-orange);
        }

           

        /* ── Checkbox ────────────────────────────────────────────────────── */
        .slu-check-group { display: flex; flex-wrap: wrap; gap: 8px; }
        .slu-check-option {
            display: flex; align-items: center; gap: 8px;
            padding: 7px 14px;
            border: 1.5px solid var(--slu-border);
            border-radius: var(--radius-sm);
            font-size: 13px; color: var(--slu-mid);
            cursor: pointer; background: var(--slu-cream);
            transition: all .18s; user-select: none;
        }
        .slu-check-option input[type="checkbox"] { display: none; }
        .slu-check-option:has(input:checked) {
            background: var(--slu-orange-muted);
            border-color: var(--slu-orange);
            color: var(--slu-orange); font-weight: 600;
        }
        .slu-check-box {
            width: 16px; height: 16px; border-radius: 4px;
            border: 2px solid var(--slu-border); background: white;
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; transition: all .15s;
        }
        .slu-check-option:has(input:checked) .slu-check-box {
            background: var(--slu-orange); border-color: var(--slu-orange);
        }
        .slu-check-option:has(input:checked) .slu-check-box::after {
            content: ''; width: 8px; height: 5px;
            border-left: 2px solid white; border-bottom: 2px solid white;
            transform: rotate(-45deg) translateY(-1px); display: block;
        }

        /* ── Section title ───────────────────────────────────────────────── */
        .slu-section-title {
            font-family: var(--font-display);
            font-size: 12px; font-weight: 700;
            text-transform: uppercase; letter-spacing: 1.5px;
            color: var(--slu-subtle);
            padding-bottom: 10px;
            border-bottom: 1px solid var(--slu-border);
            margin-bottom: 18px; margin-top: 28px;
        }
        .slu-section-title:first-child { margin-top: 0; }

        /* ── Availability badge (museu) ──────────────────────────────────── */
        .slu-availability {
            display: flex; align-items: center; gap: 10px;
            padding: 10px 14px; border-radius: var(--radius-sm);
            font-size: 13px; font-weight: 500;
            border: 1px solid transparent; transition: all .2s;
        }
        .slu-availability--ok   { background: rgba(45,106,45,.08); border-color: rgba(45,106,45,.25); color: var(--slu-green); }
        .slu-availability--warn { background: rgba(245,200,66,.12); border-color: rgba(245,200,66,.4); color: #856400; }
        .slu-availability--full { background: rgba(220,53,69,.08); border-color: rgba(220,53,69,.25); color: #DC3545; }
        .slu-availability__dot  { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex-shrink: 0; }

        /* ── Buttons ─────────────────────────────────────────────────────── */
        .slu-btn {
            display: inline-flex; align-items: center; gap: 8px;
            font-family: var(--font-display);
            font-weight: 700; font-size: 14px; letter-spacing: 0.3px;
            padding: 13px 28px; border-radius: var(--radius-sm);
            border: none; cursor: pointer; transition: all .18s; text-decoration: none;
        }
        .slu-btn--primary { background: var(--slu-orange); color: white; }
        .slu-btn--primary:hover {
            background: var(--slu-orange-hover);
            transform: translateY(-1px);
            box-shadow: 0 6px 20px rgba(232,80,26,0.30);
        }
        .slu-btn--primary:active { transform: translateY(0); }
        .slu-btn--primary:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
        .slu-btn--ghost {
            background: transparent; color: var(--slu-mid);
            border: 1.5px solid var(--slu-border);
        }
        .slu-btn--ghost:hover { border-color: var(--slu-orange); color: var(--slu-orange); }
        .slu-btn svg { width: 16px; height: 16px; fill: currentColor; }

        /* ── Form actions ────────────────────────────────────────────────── */
        .slu-form-actions {
            display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
            padding-top: 24px; margin-top: 8px;
            border-top: 1px solid var(--slu-border);
        }
        .slu-form-actions__lgpd {
            font-size: 11px; color: var(--slu-subtle);
            line-height: 1.4; flex: 1; min-width: 200px;
        }
        .slu-form-actions__lgpd a { color: var(--slu-orange); }

        /* ── Success ─────────────────────────────────────────────────────── */
        .slu-success { text-align: center; padding: 60px 24px; }
        .slu-success__icon {
            width: 80px; height: 80px; border-radius: 50%;
            background: linear-gradient(135deg, var(--slu-green), #4CAF50);
            display: flex; align-items: center; justify-content: center;
            margin: 0 auto 24px;
            box-shadow: 0 8px 32px rgba(45,106,45,0.28);
        }
        .slu-success__icon svg { width: 36px; height: 36px; fill: white; }
        .slu-success__title {
            font-family: var(--font-display); font-weight: 800;
            font-size: 28px; margin-bottom: 4px;
        }
        .slu-success__subtitle {
            font-size: 15px; color: var(--slu-mid);
            max-width: 460px; margin: 0 auto 32px; line-height: 1.6;
        }
        .slu-protocol {
            display: inline-block;
            background: var(--slu-cream-dark);
            border: 2px dashed var(--slu-border);
            border-radius: var(--radius-md);
            padding: 20px 36px; margin-bottom: 28px;
        }
        .slu-protocol small {
            font-size: 10px; text-transform: uppercase;
            letter-spacing: 1.5px; color: var(--slu-subtle); font-weight: 600;
        }
        .slu-protocol__number {
            display: block;
            font-family: var(--font-display);
            font-size: 26px; font-weight: 800;
            color: var(--slu-orange); letter-spacing: 2px; margin-top: 6px;
        }

        /* ── Footer ──────────────────────────────────────────────────────── */
        .slu-footer {
            background: var(--slu-dark);
            padding: 28px clamp(16px, 4vw, 48px);
            text-align: center; margin-top: auto;
        }
        .slu-footer p { font-size: 12px; color: rgba(255,255,255,0.30); line-height: 1.6; }
        .slu-footer strong { color: rgba(255,255,255,0.55); }
        .slu-footer a { color: var(--slu-orange-light); text-decoration: none; }

        [x-cloak] { display: none !important; }

        @media (max-width: 640px) {
            .slu-fieldset--2col,
            .slu-fieldset--3col { grid-template-columns: 1fr; }
            .slu-radio-group { flex-direction: column; }
            .slu-form-actions { flex-direction: column; align-items: flex-start; }
        }