.archetype-page { background:#f0e7dc; color:#31241e; }
.archetype-hero { padding:80px 0 65px; background:linear-gradient(125deg,#eee1cf,#faf5eb); }
.archetype-hero__grid { display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:52px; }
.archetype-hero h1 { font:italic 400 clamp(2.9rem,5.1vw,5.6rem)/1.08 'Libre Baskerville',Georgia,serif; letter-spacing:-.04em; margin:20px 0; }
.archetype-hero h1 em { color:#96673e; }
.archetype-hero p { max-width:650px; color:#584839; font-size:1.14rem; line-height:1.7; }
.archetype-facts { display:flex; gap:10px; flex-wrap:wrap; margin-top:27px; }
.archetype-facts span { border:1px solid #c6a980; border-radius:100px; padding:8px 14px; color:#704f34; font-size:.8rem; font-weight:700; }
.archetype-hero__image { max-height:500px; overflow:hidden; border:1px solid #c8ab87; box-shadow:0 25px 60px #4026192b; }
.archetype-hero__image img { width:100%; height:500px; object-fit:cover; object-position:center 25%; }
.archetype-stage { padding:72px 0 60px; }
.archetype-shell { max-width:850px; margin:auto; scroll-margin-top:22px; }
.archetype-card { padding:clamp(25px,5vw,55px); border:1px solid #c7aa82; background:#fffbf5; box-shadow:0 28px 65px #4e2b1830; }
.archetype-card h2,
.archetype-result h2 { font:italic 400 clamp(2rem,3.7vw,3.7rem)/1.16 'Libre Baskerville',Georgia,serif; margin:20px 0 28px; color:#32231d; }
.archetype-card--intro { text-align:center; max-width:750px; margin:auto; }
.archetype-card--intro h2 { margin-bottom:15px; }
.archetype-card--intro p { max-width:540px; margin:0 auto 30px; color:#584739; line-height:1.7; }
.archetype-card--intro small { display:block; margin-top:22px; color:#755d48; }
.archetype-card__ornament { color:#bd965f; font-size:2.5rem; }
.archetype-progress { display:flex; justify-content:space-between; gap:15px; color:#825d3b; font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.archetype-progress__bar { height:5px; margin:12px 0 30px; border-radius:100px; background:#e7d6bc; overflow:hidden; }
.archetype-progress__bar span { display:block; height:100%; background:linear-gradient(90deg,#8e5e3a,#d1af75); transition:width .25s; }
.archetype-options { display:grid; gap:12px; }
.archetype-option { display:flex; align-items:center; gap:14px; width:100%; border:1px solid #d1bfa9; background:#fbf5ec; color:#38291f; padding:16px 18px; text-align:left; font-size:1rem; line-height:1.4; transition:border-color .2s,background .2s,transform .2s; }
.archetype-option:hover { border-color:#a67b50; transform:translateY(-2px); }
.archetype-option.is-selected { border-color:#a67b50; background:#edddc8; }
.archetype-option:focus-visible,.archetype-controls button:focus-visible { outline:3px solid #b68954; outline-offset:2px; }
.archetype-option__dot { width:17px; height:17px; flex:0 0 17px; border:1.5px solid #a67b50; border-radius:50%; }
.archetype-option.is-selected .archetype-option__dot { background:#a67b50; box-shadow:inset 0 0 0 4px #edddc8; }
.archetype-controls { display:flex; justify-content:space-between; gap:14px; margin-top:30px; }
.archetype-controls .button:disabled { opacity:.4; cursor:not-allowed; transform:none; }
.archetype-privacy { max-width:760px; margin:24px auto 0; color:#6e5a49; font-size:.82rem; text-align:center; line-height:1.6; }
.archetype-result { display:grid; gap:18px; }
.archetype-result__hero { padding:48px; border:1px solid #aa865c; background:radial-gradient(circle at 86% 12%,#5c4239,#2d211e 65%); color:#f7ecda; }
.archetype-result__hero h2 { color:#f2d7a7; font-size:clamp(3rem,5vw,5rem); margin:12px 0 8px; }
.archetype-result__hero p { color:#f2e5d3; max-width:720px; font-size:1.08rem; line-height:1.7; }
.archetype-result__tagline { font-family:Georgia,serif; font-style:italic; font-size:1.35rem!important; color:#e0bd86!important; }
.archetype-result__blend { padding-top:16px; border-top:1px solid #b5906a99; font-size:.92rem!important; }
.archetype-result__grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.archetype-result__panel,.archetype-result__step,.archetype-result__scores,.archetype-result__roadmap { padding:30px; border:1px solid #ccb390; background:#fffaf2; }
.archetype-result h3 { font:italic 400 1.7rem/1.25 'Libre Baskerville',Georgia,serif; color:#38261f; margin:0 0 16px; }
.archetype-result ul { margin:0; padding-left:1.2rem; color:#564438; line-height:1.7; }
.archetype-result li { padding:5px 0; }
.archetype-result__step { border-left:4px solid #b38850; background:#f5e8d5; }
.archetype-result__step p { color:#392920; font:italic 400 clamp(1.25rem,2vw,1.7rem)/1.45 Georgia,serif; margin:13px 0 0; }
.archetype-score-list { display:grid; gap:9px; }
.archetype-score { display:grid; grid-template-columns:155px 1fr 24px; align-items:center; gap:10px; font-size:.9rem; color:#433125; }
.archetype-score__bar { height:8px; background:#e8d8c3; border-radius:20px; overflow:hidden; }
.archetype-score__bar span { display:block; height:100%; background:#b58a56; }
.archetype-result__scores p { font-size:.8rem; color:#715c49; margin-bottom:0; }
.archetype-result__roadmap>div { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.archetype-result__roadmap span { display:flex; flex-direction:column; gap:10px; padding:14px; background:#eee0ca; font-size:.88rem; }
.archetype-result__roadmap b { color:#906740; font:italic 1.4rem Georgia,serif; }
.archetype-result__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:9px; }
.archetype-after h2 { font:italic 400 clamp(2.2rem,4.2vw,4rem)/1.13 'Libre Baskerville',Georgia,serif; }
@media(max-width:760px) { .archetype-hero__grid,.archetype-result__grid { grid-template-columns:1fr; } .archetype-hero { padding:55px 0; } .archetype-hero__image img { height:360px; } .archetype-result__roadmap>div { grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px) { .archetype-controls,.archetype-result__actions { flex-direction:column; } .archetype-controls .button,.archetype-result__actions .button { width:100%; } .archetype-result__hero { padding:30px; } .archetype-score { grid-template-columns:116px 1fr 17px; font-size:.78rem; } .archetype-result__roadmap>div { grid-template-columns:1fr 1fr; } }
