/* Quiet depth: decorative layers move; navigation and reading surfaces stay still. */
html { scroll-behavior:auto; }
.hero { gap:34px; padding-top:67px; padding-bottom:67px; }
.hero-credo { max-width:480px; }
.hero-lead { font-size:17px; line-height:1.8; color:#687482; }
.hero-lead strong { display:inline-block; margin-top:4px; color:#152438; font-weight:750; }
.credo-terms { max-width:410px; margin-top:14px; font-size:12px; line-height:1.8; color:#7a8799; }
.hero-visual { perspective:1200px; isolation:isolate; overflow:visible; border-radius:22px; background:transparent; min-height:530px; }
.hero-visual::before { content:''; position:absolute; inset:22px -7px -13px 21px; border:1px solid #cad7ea; border-radius:24px; background:linear-gradient(145deg,#edf3fc,#dce6f7); transform:rotate(2.2deg); box-shadow:0 20px 38px -25px #183d7b4a; z-index:-1; }
.hero-visual::after { content:''; position:absolute; inset:12px 5px -7px 10px; border:1px solid #fff; border-radius:23px; background:linear-gradient(145deg,#fff,#e2e9f3); transform:rotate(-1deg); z-index:-1; }
.hero-scene { position:absolute; inset:0; border-radius:22px; overflow:hidden; background:#edf2f8; border:1px solid #ffffffd9; box-shadow:0 2px 5px #22446c06,0 18px 35px -14px #18335225,0 40px 70px -38px #15355b54; transform:rotateX(var(--tilt-x,1deg)) rotateY(var(--tilt-y,-1.5deg)); transition:transform .45s cubic-bezier(.2,.7,.2,1); }
.hero-scene::after { content:''; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(circle at var(--light-x,15%) var(--light-y,10%),#ffffff35,transparent 55%); box-shadow:inset 0 0 0 1px #ffffff80,inset 0 2px 4px #fff9; pointer-events:none; z-index:3; }
.hero-art { width:104%; max-width:none; height:104%; inset:-2%; }
.visual-topline,.visual-bottom { z-index:4; }
.visual-topline { top:28px; }
.visual-label { z-index:4; bottom:83px; padding:15px 20px 15px 14px; border:1px solid #ffffffe6; background:#ffffffdc; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); box-shadow:0 3px 5px #1b3b6805,0 13px 25px -9px #1b3b682e,inset 0 1px 0 #fff; transform:translateY(-3px) rotate(-1deg); }
.label-icon { background:linear-gradient(145deg,#fff,#e0eaff); border:1px solid #fff; box-shadow:inset 0 -2px 4px #aac4f229,2px 3px 5px #224d8517; }
.button { background:linear-gradient(165deg,#2c74ff,#1357e1); border-color:#1b60e4; box-shadow:inset 0 1px 0 #ffffff35,0 3px 5px #1554d60a,0 9px 18px -10px #1554d69c; }
.button:hover { background:linear-gradient(165deg,#397eff,#064bd1); box-shadow:inset 0 1px 0 #ffffff40,0 13px 22px -9px #1554d679; }
.button-white { background:linear-gradient(165deg,#fff,#e8eef8); border-color:#fff; box-shadow:inset 0 1px 0 #fff,0 5px 14px #0002; }
.button-white:hover { background:#fff; }
.approach-card { border-color:#e2e7ef; background:linear-gradient(145deg,#fff,#fafbfd); box-shadow:0 3px 4px #132d4c02,0 14px 25px -15px #1c365a16; transition:transform .25s,box-shadow .25s; }
.approach-card .line-icon { width:45px; height:45px; display:grid; place-items:center; border:1px solid #fff; border-radius:12px; background:linear-gradient(145deg,#f8fbff,#e6eefc); box-shadow:inset 0 -2px 3px #b8cef333,2px 5px 9px #1b55a414; }
.approach-card .line-icon svg { width:28px; height:28px; }
.blue-card { background:linear-gradient(145deg,#2a71fb,#1255dd 75%,#0848c8); border-color:#1a5fe4; box-shadow:inset 0 1px 0 #ffffff40,0 18px 29px -20px #164fbf7a; }
.blue-card .line-icon { background:linear-gradient(145deg,#4c8bff,#2667e9); border-color:#6ca0ff66; box-shadow:inset 0 1px 0 #ffffff38,2px 5px 9px #002b8e30; }
.about { box-shadow:inset 0 1px 0 #ffffff12,0 24px 45px -31px #0f2b5790; background:linear-gradient(115deg,#102039,#132540 70%,#162c4b); }
.about-monogram { color:#355a8a; text-shadow:1px 1px 0 #2b4b78,2px 2px 0 #2a4873,3px 3px 0 #25436b,4px 4px 0 #203c62,8px 10px 0 #0c1b2f,15px 18px 20px #0003; transform:perspective(800px) rotateY(-14deg); }
.quiz { box-shadow:inset 0 2px 0 #fff,0 3px 6px #142e4b03,0 20px 42px -25px #25477847; border-color:#dce3ee; }
.quiz-choice { position:relative; cursor:pointer; background:linear-gradient(135deg,#fff,#fcfdff); padding:15px; font-size:13px; }
.quiz-choice input { position:absolute; width:1px; height:1px; opacity:0; }
.quiz-choice:focus-within { outline:3px solid #8eb5ff; outline-offset:3px; }
.quiz-choice:has(input:checked) { background:#eff5ff; border-color:#377bf2; box-shadow:inset 0 1px 2px #dce8ff80; }
.quiz-choice input:checked + .choice-radio { border:4px solid var(--blue); }
.quiz-choice>span.choice-copy:last-child { margin-left:0; color:var(--ink); font-size:inherit; line-height:1.5; text-align:left; }
.choice-copy small { display:block; color:#8b98aa; font-size:10px; font-weight:450; margin-top:4px; }
.quiz-detail { margin-top:20px; }
.quiz-detail label { display:block; font-size:11px; line-height:1.6; color:#64748b; margin-bottom:8px; }
.quiz-detail input { width:100%; min-height:46px; border:1px solid #dbe3ef; border-radius:7px; background:#fcfdff; padding:12px 13px; color:var(--ink); font-size:12px; }
.quiz-detail input::placeholder { color:#a2adbc; }
.quiz-detail input:focus { border-color:var(--blue); }
.quiz-footer { display:grid; grid-template-columns:auto 1fr auto; gap:14px; }
.quiz-footer>span { text-align:center; font-size:9px; line-height:1.5; }
.quiz-footer .quiz-next { min-height:44px; padding:12px 16px; gap:17px; color:white; background:linear-gradient(165deg,#2c74ff,#1357e1); border:1px solid #1b60e4; font-size:11px; }
.quiz-footer .quiz-next:disabled { visibility:visible; background:#e9eef6; color:#94a2b5; border-color:#e3eaf4; box-shadow:none; transform:none; cursor:default; }
.quiz-footer .quiz-next[hidden] { display:none; }
.quiz-footer #quiz-back { min-height:44px; padding:10px 0; }
.quiz-summary .summary-row { align-items:flex-start; }
.summary-row dd { overflow-wrap:anywhere; }
.result-call { display:flex; width:100%; margin-top:23px; padding-inline:16px; gap:12px; }
.result-call>span:first-child { font-size:12px; line-height:1.5; }
.result-call small { display:block; font-size:16px; font-weight:650; letter-spacing:.02em; margin-top:4px; }
.result-secondary { text-align:center; margin-top:17px; }
.result-secondary button { background:none; border:0; font-size:11px; color:#5376ab; padding:8px; }
.result-secondary button:hover { color:var(--blue); text-decoration:underline; }
.result-secondary button span { font-size:16px; margin-left:5px; }
.result-note { line-height:1.85; }
@media(hover:hover) and (pointer:fine) { .approach-card:hover { transform:translateY(-4px); box-shadow:0 18px 34px -15px #25477829; } }
@media(max-width:1100px) { .hero { gap:28px; padding-block:53px; }.hero-visual { min-height:490px; }.hero-lead { font-size:15px; }.credo-terms { font-size:11px; max-width:350px; }.hero-scene { border-radius:19px; }.quiz-choice { font-size:12px; }.quiz-footer { gap:10px; }.quiz-footer>span { font-size:8px; }.quiz-footer .quiz-next { padding-inline:13px; gap:12px; font-size:10px; } }
@media(max-width:800px) { .hero { gap:24px; }.hero-visual { min-height:440px; }.hero-lead { font-size:13px; }.credo-terms { font-size:10px; }.hero-visual::before { inset:15px -4px -9px 13px; transform:rotate(1.5deg); }.hero-visual::after { inset:9px 4px -5px 7px; }.quiz-footer { grid-template-columns:auto 1fr; gap:6px 12px; }.quiz-footer>span { grid-row:2; grid-column:1/-1; font-size:9px; }.quiz-footer .quiz-next { justify-self:end; }.quiz-choice { font-size:11px; }.choice-copy small { font-size:9px; }.visual-label { padding:11px; }.visual-label strong { font-size:9px; } }
@media(max-width:600px) { .hero { gap:34px; padding-top:31px; padding-bottom:43px; }.hero-visual { min-height:360px; max-height:440px; }.hero-lead { font-size:15px; line-height:1.8; }.hero-lead strong { max-width:330px; margin-top:5px; }.credo-terms { font-size:12px; line-height:1.8; max-width:335px; margin-top:13px; }.hero-scene { transform:none; border-radius:17px; }.hero-visual::before { border-radius:19px; }.hero-visual::after { border-radius:18px; }.visual-topline { top:21px; }.visual-label { padding:12px 15px 12px 12px; bottom:67px; }.visual-label strong { font-size:10px; }.quiz { padding:25px 22px; }.quiz-choice { font-size:13px; min-height:62px; padding:14px 12px; }.choice-copy small { font-size:10px; }.quiz-detail label { font-size:11px; }.quiz-detail input { font-size:13px; min-height:48px; }.quiz-footer .quiz-next { min-height:46px; font-size:11px; gap:15px; padding-inline:16px; }.quiz-footer>span { font-size:9px; }.result-call small { font-size:18px; }.result-call>span:first-child { font-size:12px; }.about-monogram { display:none; } }
@media(max-width:370px) { .hero-visual { min-height:310px; }.hero-lead { font-size:14px; }.credo-terms { font-size:11px; }.quiz { padding-inline:18px; } }
@media(prefers-reduced-motion:reduce) { .hero-scene,.about-monogram { transform:none!important; }.approach-card:hover { transform:none; } }
@media(max-width:600px) { .quiz-detail input { font-size:16px; } }