:root{--ink:#170d23;--muted:#716879;--purple:#7440ed;--violet:#ad63ff;--cyan:#25cfc7;--line:78,49,122;--ease:cubic-bezier(.22,1,.36,1)}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{overflow-x:clip;scroll-behavior:smooth}
body{margin:0;overflow-x:clip;color:var(--ink);background:radial-gradient(circle at 8% 5%,rgba(177,112,255,.16),transparent 26%),radial-gradient(circle at 92% 36%,rgba(48,217,209,.14),transparent 25%),linear-gradient(180deg,#faf9fd,#f1edf9 54%,#edf7f8);font-family:Manrope,sans-serif;font-size:16px;line-height:1.6}
body.menu-open{overflow:hidden}
button,input,textarea{font:inherit}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
h1,h2,p,ul{margin:0}
.shell{width:min(1120px,calc(100% - 48px));margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip-link{position:fixed;z-index:1000;top:10px;left:10px;padding:10px 14px;border-radius:10px;color:#fff;background:var(--purple);transform:translateY(-150%)}
.skip-link:focus{transform:none}

.site-header{position:fixed;z-index:200;inset:0 0 auto;padding-top:14px;pointer-events:none}
.nav{position:relative;min-height:74px;display:flex;align-items:center;gap:22px;padding:10px 11px 10px 12px;border:1px solid rgba(255,255,255,.78);border-radius:25px;background:linear-gradient(110deg,#fff,#f6f2ff,#edfcfd);box-shadow:0 22px 55px rgba(33,18,58,.16),inset 0 1px 0 #fff;pointer-events:auto;transition:min-height 220ms var(--ease),border-radius 220ms var(--ease)}
.nav::after{position:absolute;right:13%;bottom:-1px;left:13%;height:1px;background:linear-gradient(90deg,transparent,var(--purple),var(--cyan),transparent);content:"";opacity:.5}
.site-header.is-scrolled{padding-top:8px}
.site-header.is-scrolled .nav{min-height:64px;border-radius:20px}
.brand{min-width:max-content;display:inline-flex;align-items:center;gap:11px}
.brand-mark{width:50px;height:50px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(112,62,132,.14);border-radius:16px;background:linear-gradient(145deg,#fff,#eee9ff);box-shadow:0 10px 26px rgba(78,43,164,.14)}
.brand-mark img{width:38px;height:38px;object-fit:contain}
.brand-lockup{display:grid;gap:2px;line-height:1}
.brand-lockup strong{font-size:14px;font-weight:800;letter-spacing:-.035em}
.brand-lockup small{color:#7c7488;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.nav-status{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;color:#665e72;border:1px solid rgba(88,68,128,.09);border-radius:999px;background:rgba(255,255,255,.54);font-size:12px;font-weight:800}
.nav-status i{width:7px;height:7px;border-radius:50%;background:#24d5b6;box-shadow:0 0 0 4px rgba(36,213,182,.12)}
.nav-menu{display:flex;align-items:center;margin-left:auto}
.nav-links{display:flex;gap:2px;padding:4px;border:1px solid rgba(65,44,103,.06);border-radius:15px;background:rgba(40,22,73,.045)}
.nav-links a{min-height:36px;display:flex;align-items:center;padding:0 12px;color:#5b5367;border-radius:11px;font-size:12px;font-weight:800}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--ink);background:rgba(255,255,255,.9);box-shadow:0 8px 20px rgba(43,24,79,.09)}
.nav-toggle{position:relative;width:46px;height:46px;display:none;place-items:center;margin-left:auto;padding:0;border:1px solid rgba(91,67,134,.13);border-radius:14px;background:rgba(255,255,255,.82);cursor:pointer}
.nav-toggle-icon{position:absolute;width:18px;height:12px}
.nav-toggle-icon i{position:absolute;left:0;width:18px;height:2px;border-radius:999px;background:var(--ink);transition:transform 220ms var(--ease)}
.nav-toggle-icon i:first-child{transform:translateY(-4px)}
.nav-toggle-icon i:last-child{transform:translateY(4px)}
.nav-toggle.is-open .nav-toggle-icon i:first-child{transform:rotate(45deg)}
.nav-toggle.is-open .nav-toggle-icon i:last-child{transform:rotate(-45deg)}

.survey-intro{padding:150px 0 52px}
.intro-grid{display:grid;grid-template-columns:1fr .8fr;gap:72px;align-items:end}
.kicker{display:flex;align-items:center;gap:10px;color:#6938da;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.kicker>span:first-child{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--cyan));box-shadow:0 0 0 6px rgba(116,64,237,.09)}
h1,h2{font-family:Georgia,"Times New Roman",serif;font-weight:700;text-wrap:balance}
h1{margin-top:18px;font-size:clamp(3.4rem,6.5vw,6.4rem);line-height:.88;letter-spacing:-.06em}
h1 em{color:transparent;background:linear-gradient(105deg,var(--violet),var(--purple) 52%,var(--cyan));background-clip:text;-webkit-background-clip:text;font-style:normal}
.intro-note>p{color:var(--muted);font-size:17px}
.intro-note ul{display:flex;flex-wrap:wrap;gap:8px;margin:23px 0 0;padding:0;list-style:none}
.intro-note li{padding:8px 11px;border:1px solid rgba(var(--line),.1);border-radius:999px;background:rgba(255,255,255,.6);color:#5f5768;font-size:12px;font-weight:700}

.survey-progress{position:sticky;z-index:90;top:86px;border-block:1px solid rgba(var(--line),.08);background:rgba(248,247,252,.9);backdrop-filter:blur(16px)}
.progress-inner{display:grid;grid-template-columns:auto minmax(250px,420px);align-items:center;justify-content:space-between;gap:30px;padding-block:13px}
.progress-inner p{display:flex;gap:12px;color:var(--muted);font-size:13px}
.progress-inner strong{color:var(--ink)}
.progress-track{height:6px;overflow:hidden;border-radius:999px;background:rgba(var(--line),.09)}
.progress-track span{width:0;height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--purple),#5e58ef,var(--cyan));transition:width 240ms var(--ease)}

.survey-form{display:grid;gap:16px;padding-block:38px 90px}
.respondent-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.62fr);gap:34px;align-items:center;padding:32px 34px;overflow:hidden;border:2px solid rgba(116,64,237,.42);border-radius:24px;background:linear-gradient(120deg,rgba(238,226,255,.96),rgba(255,255,255,.94) 56%,rgba(221,250,248,.9));box-shadow:0 20px 58px rgba(91,44,173,.13)}
.respondent-card::before{position:absolute;inset:0 auto 0 0;width:7px;background:linear-gradient(180deg,var(--purple),var(--cyan));content:""}
.respondent-card h2{margin-top:10px;font-size:32px;line-height:1.05}
.respondent-card>div>p:last-child{max-width:650px;margin-top:12px;color:var(--muted);font-size:14px}
.respondent-card .kicker strong{padding:4px 8px;border-radius:999px;color:#fff;background:var(--purple);font-size:10px;letter-spacing:.08em}
.respondent-card label{display:grid;gap:9px;padding:16px;border:1px solid rgba(116,64,237,.15);border-radius:18px;color:#33263e;background:rgba(255,255,255,.74);box-shadow:0 12px 28px rgba(69,35,126,.08);font-size:14px;font-weight:800}
.respondent-card label small{color:var(--muted);font-size:11px;font-weight:600;line-height:1.4}
.respondent-card input{width:100%;min-height:56px;padding:0 15px;border:2px solid rgba(116,64,237,.28);border-radius:14px;color:var(--ink);background:#fff;outline:none}
.respondent-card input:focus{border-color:rgba(116,64,237,.52);box-shadow:0 0 0 4px rgba(116,64,237,.09)}
.question-card{position:relative;display:grid;grid-template-columns:74px 1fr;gap:22px;padding:30px;border:1px solid rgba(var(--line),.1);border-radius:24px;background:rgba(255,255,255,.72);box-shadow:0 18px 50px rgba(50,31,82,.06);transition:border-color 180ms var(--ease),background 180ms var(--ease),box-shadow 180ms var(--ease)}
.question-card.is-complete{border-color:rgba(37,185,172,.3);background:linear-gradient(120deg,rgba(255,255,255,.84),rgba(231,250,247,.66))}
.question-card.is-complete::after{position:absolute;top:14px;right:17px;color:#148479;content:"Answered \2713";font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.respondent-card.is-complete{border-color:rgba(37,185,172,.48)}
.respondent-card.is-missing,.question-card.is-missing{border-color:#e13d69;background:linear-gradient(120deg,#fff5f8,#fff);box-shadow:0 0 0 4px rgba(225,61,105,.1),0 22px 55px rgba(111,28,55,.11)}
.question-card.is-missing::after{position:absolute;top:13px;right:16px;padding:5px 9px;border-radius:999px;color:#a61843;background:#ffe1e9;content:"Rating required";font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.respondent-card.is-missing input{border-color:#e13d69;box-shadow:0 0 0 4px rgba(225,61,105,.1)}
.question-number{padding-top:4px;color:transparent;background:linear-gradient(145deg,var(--purple),var(--cyan));background-clip:text;-webkit-background-clip:text;font-family:Georgia,serif;font-size:32px;font-weight:700}
fieldset{min-width:0;margin:0;padding:0;border:0}
legend{width:100%;padding:0;font-family:Georgia,"Times New Roman",serif;font-size:27px;font-weight:700;line-height:1.18}
legend span{display:block;margin-bottom:7px;color:#6b3cdc;font-family:Manrope,sans-serif;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.rating{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:22px}
.rating label{position:relative;min-width:0}
.rating input{position:absolute;opacity:0}
.rating span{min-height:54px;display:grid;place-items:center;padding:7px;border:1px solid rgba(var(--line),.13);border-radius:13px;background:rgba(255,255,255,.66);cursor:pointer;text-align:center;transition:transform 160ms var(--ease),box-shadow 160ms var(--ease)}
.rating span strong{display:block;font-size:16px}
.rating span small{display:block;color:var(--muted);font-size:12px;font-weight:700;line-height:1.2}
.rating input:checked+span{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--purple),#5663ed 64%,var(--cyan));box-shadow:0 10px 24px rgba(96,67,205,.2);transform:translateY(-2px)}
.rating input:checked+span small{color:rgba(255,255,255,.82)}
.rating input:focus-visible+span{outline:3px solid rgba(116,64,237,.25);outline-offset:2px}
details{margin-top:20px;border-top:1px solid rgba(var(--line),.09);padding-top:16px}
summary{width:max-content;color:#5c3a9f;cursor:pointer;font-size:13px;font-weight:800}
summary span{margin-left:7px;color:#8c8295;font-size:11px;font-weight:600}
details label{display:grid;gap:10px;margin-top:15px;color:#43384c;font-size:14px;font-weight:700}
textarea{width:100%;min-height:92px;padding:12px 14px;border:1px solid rgba(var(--line),.14);border-radius:13px;color:var(--ink);background:rgba(255,255,255,.72);outline:none;resize:vertical}
textarea:focus{border-color:rgba(116,64,237,.52);box-shadow:0 0 0 4px rgba(116,64,237,.09)}

.submit-panel{display:grid;grid-template-columns:1fr auto;gap:12px 30px;align-items:center;margin-top:14px;padding:34px 38px;border-radius:28px;color:#fff;background:linear-gradient(125deg,#7025ef,#7e35ff 42%,#2c5ec2 74%,#166f85);box-shadow:0 28px 70px rgba(43,21,80,.2)}
.submit-panel .kicker{color:#ded2f5}
.submit-panel h2{margin-top:10px;font-size:38px;line-height:1}
.submit-panel>div>p:last-child{margin-top:10px;color:rgba(255,255,255,.75);font-size:14px}
.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 21px;border:0;border-radius:15px;color:var(--ink);background:#fff;box-shadow:0 14px 35px rgba(30,12,58,.2);cursor:pointer;font-size:14px;font-weight:800;transition:transform 170ms var(--ease)}
.button:hover{transform:translateY(-2px)}
.button:disabled{cursor:wait;opacity:.72;transform:none}
.form-error{grid-column:1/-1;min-height:1.3em;color:#fff;font-size:14px;font-weight:800}
.form-error:not(:empty){padding:12px 14px;border:1px solid rgba(255,255,255,.34);border-radius:12px;background:rgba(57,9,29,.28)}

.finish-view{position:relative;min-height:calc(100svh - 210px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:42px 70px;align-items:center;margin-top:132px;margin-bottom:72px;padding:clamp(54px,7vw,92px);overflow:hidden;border:1px solid rgba(255,255,255,.28);border-radius:38px;color:#fff;background:radial-gradient(circle at 82% 18%,rgba(38,221,210,.24),transparent 30%),linear-gradient(125deg,#7025ef,#7e35ff 42%,#2c5ec2 74%,#166f85);box-shadow:0 35px 90px rgba(56,29,105,.2)}
.finish-view::before{position:absolute;right:-9%;bottom:-58%;width:min(620px,55vw);aspect-ratio:1;border:1px solid rgba(255,255,255,.16);border-radius:50%;content:"";box-shadow:0 0 0 80px rgba(255,255,255,.035),0 0 0 180px rgba(255,255,255,.025)}
.finish-view[hidden]{display:none}
.finish-copy{position:relative;z-index:1;max-width:760px}
.finish-check{width:72px;height:72px;display:grid;place-items:center;margin-bottom:32px;border:1px solid rgba(255,255,255,.4);border-radius:50%;color:#171020;background:#fff;box-shadow:0 20px 45px rgba(25,10,55,.2);font-size:31px;font-weight:800}
.finish-view h2{max-width:720px;margin-top:18px;font-size:clamp(3.2rem,6.3vw,6.3rem);line-height:.9;letter-spacing:-.055em}
.finish-copy>p:last-child{max-width:650px;margin-top:24px;color:rgba(255,255,255,.78);font-size:17px;line-height:1.7}
.kicker-light{color:#ded2f5}
.finish-actions{position:relative;z-index:1;min-width:190px;display:grid;justify-items:center;gap:17px}
.finish-support{font-size:13px;font-weight:800;text-decoration:underline;text-underline-offset:5px}
.button-ghost{color:#fff;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);box-shadow:none}
.finish-view>[data-status]{grid-column:1/-1;color:rgba(255,255,255,.8);font-size:13px}

.site-footer{border-top:1px solid rgba(var(--line),.1);background:rgba(250,249,253,.72)}
.footer-grid{display:grid;grid-template-columns:1fr 1.3fr auto;align-items:center;gap:35px;padding:44px 0}
.footer-lockup{display:flex;align-items:center;gap:10px}
.footer-lockup img{width:38px;height:38px}
.footer-lockup strong{font-size:16px}
.footer-grid>p{color:var(--muted);font-size:13px}
.footer-grid>div{display:flex;gap:18px}
.footer-grid>div a{color:#665e70;font-size:12px;font-weight:800}
.footer-bottom{padding:17px 0;border-top:1px solid rgba(var(--line),.09);color:#857b8f;font-size:11px}

@media(max-width:900px){
  .nav-toggle{display:grid}
  .nav-menu{position:absolute;top:calc(100% + 10px);right:0;left:0;display:block;padding:12px;border:1px solid rgba(var(--line),.1);border-radius:22px;background:rgba(250,249,255,.98);box-shadow:0 28px 65px rgba(32,18,56,.16);opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity 180ms var(--ease),transform 220ms var(--ease)}
  .nav-menu.is-open{opacity:1;pointer-events:auto;transform:none}
  .nav-links{display:grid}
  .nav-links a{min-height:48px;padding-inline:14px;font-size:14px}
  .intro-grid{grid-template-columns:1fr;gap:28px}
  .respondent-card{grid-template-columns:1fr}
  .finish-view{grid-template-columns:1fr;align-content:center}
}
@media(max-width:680px){
  .shell{width:min(640px,calc(100% - 28px))}
  .site-header{padding-top:8px}
  .nav,.site-header.is-scrolled .nav{min-height:60px;padding:6px 7px 6px 8px;border-radius:19px}
  .brand-mark{width:44px;height:44px;border-radius:14px}
  .brand-mark img{width:34px;height:34px}
  .brand-lockup strong{font-size:13px}
  .brand-lockup small,.nav-status{display:none}
  .survey-intro{padding:100px 0 32px}
  h1{font-size:clamp(3rem,15vw,4.6rem)}
  .intro-note>p{font-size:15px}
  .survey-progress{top:68px}
  .progress-inner{grid-template-columns:1fr;gap:8px;padding-block:10px}
  .progress-inner p{justify-content:space-between}
  .progress-inner p span{display:none}
  .survey-form{gap:12px;padding-block:24px 64px}
  .respondent-card{gap:23px;padding:24px 19px;border-radius:20px}
  .respondent-card h2{font-size:27px}
  .question-card{grid-template-columns:1fr;gap:8px;padding:23px 18px;border-radius:20px}
  .question-number{font-size:22px}
  legend{font-size:23px}
  .rating{grid-template-columns:repeat(3,1fr);gap:6px;margin-top:18px}
  .rating span{min-height:58px;padding:7px 5px}
  .rating span strong{font-size:15px}
  .rating span small{font-size:12px}
  details label{font-size:13px}
  .submit-panel{grid-template-columns:1fr;padding:28px 21px}
  .submit-panel .button{width:100%}
  .finish-view{min-height:calc(100svh - 138px);margin-top:92px;margin-bottom:46px;padding:42px 24px;border-radius:26px}
  .finish-view h2{font-size:clamp(3.1rem,14vw,4.6rem)}
  .finish-copy>p:last-child{font-size:15px}
  .finish-check{width:60px;height:60px;margin-bottom:26px;font-size:26px}
  .finish-actions{width:100%}
  .finish-actions .button{width:100%}
  .footer-grid{grid-template-columns:1fr;gap:18px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important}}
