:root{
  --brand:#0a5c8a;
  --brand-2:#1478b0;
  --green:#1a8c6b;
  --green-soft:#e8f7f1;
  --blue-soft:#eaf5fb;
  --red:#c0392b;
  --red-soft:#fff0ef;
  --ink:#172b3a;
  --muted:#647989;
  --line:#cbdde8;
  --line-soft:#e8f0f5;
  --page:#f3f8fb;
  --card:#ffffff;
  --shadow:0 18px 46px rgba(10,92,138,.14);
  --radius:20px;
  --radius-sm:13px;
}
*{box-sizing:border-box;margin:0;padding:0}
fieldset{min-inline-size:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  min-height:100vh;
  font-family:"Noto Sans",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:radial-gradient(circle at top left,rgba(26,140,107,.12),transparent 34%),linear-gradient(180deg,#f9fdff 0%,var(--page) 100%);
  color:var(--ink);
  font-size:15px;
  line-height:1.5;
  padding-bottom:88px;
  -webkit-tap-highlight-color:transparent;
}
html[lang="ta"] body,
html[lang="ta"] button,
html[lang="ta"] input,
html[lang="ta"] select,
html[lang="ta"] textarea{
  font-family:"Noto Sans Tamil","Noto Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  letter-spacing:0;
}
html[lang="ta"] body{line-height:1.62}
button,input,select,textarea{font:inherit;font-size:16px}
button{border:0;cursor:pointer}
b{color:var(--red)}
em,i{font-style:normal}
.optional-tag{
  display:inline-block;
  color:#80909c;
  font-size:.66rem;
  font-weight:600;
  margin-left:.22rem;
  white-space:nowrap;
  vertical-align:middle;
  letter-spacing:0;
}
.site-header{
  background:linear-gradient(135deg,var(--brand),#0e78aa);
  color:#fff;
  padding:18px 16px 24px;
  position:relative;
  overflow:hidden;
}
.site-header::after{
  content:"";
  position:absolute;
  right:-70px;
  top:-90px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(255,255,255,.09);
}
.brand-card{
  max-width:920px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:16px;
  position:relative;
  z-index:1;
}
.logo-box{
  width:168px;
  min-width:168px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border-radius:17px;
  padding:8px 12px;
  box-shadow:0 12px 28px rgba(0,0,0,.14);
}
.logo-box img{max-width:100%;max-height:100%;object-fit:contain}
.brand-copy .eyebrow{font-size:.78rem;color:#ffe08a;font-weight:800;letter-spacing:.02em;margin-bottom:2px}
.brand-copy h1{font-size:1.45rem;line-height:1.12;margin-bottom:3px}
.brand-copy p:last-child{font-size:.9rem;color:rgba(255,255,255,.84)}
.page-shell{max-width:920px;margin:-18px auto 0;padding:0 14px 26px;position:relative;z-index:2}
.feedback-card,.success-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.hero-panel{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:start;
  padding:20px;
  background:linear-gradient(135deg,#fff,var(--blue-soft));
  border-bottom:1px solid var(--line);
}
.mini-label{color:var(--green);font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;margin-bottom:4px}
.hero-panel h2{font-size:1.25rem;color:var(--brand);margin-bottom:4px;line-height:1.25}
.hero-panel p{color:var(--muted);font-size:.92rem}
.lang-switch{display:flex;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px;box-shadow:0 8px 18px rgba(10,92,138,.08)}
.lang-btn{padding:8px 12px;border-radius:999px;background:transparent;color:var(--muted);font-weight:850;font-size:.82rem;white-space:nowrap}
.lang-btn.active{background:var(--brand);color:#fff}
.form-alert{display:none;margin:16px 20px 0;padding:12px 14px;border-radius:14px;background:var(--red-soft);border:1px solid #f0b8b1;color:#8b2d24;font-weight:800;font-size:.9rem}
.form-alert.show{display:block;animation:softRise .18s ease}
.form-section{padding:17px 20px;border-bottom:1px solid var(--line-soft)}
.section-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:13px}
.step-dot{
  width:31px;
  height:31px;
  min-width:31px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--brand);
  color:#fff;
  font-weight:900;
  font-size:.86rem;
  box-shadow:0 8px 16px rgba(10,92,138,.16);
}
.section-icon{
  width:31px;
  height:31px;
  min-width:31px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef8f3;
  color:var(--green);
  border:1px solid #cbe9dc;
  font-weight:950;
  font-size:.83rem;
  line-height:1;
}
.section-title h3{font-size:1.02rem;margin-bottom:1px;line-height:1.25}
.section-title p{color:var(--muted);font-size:.84rem;line-height:1.38}
.grid{display:grid;gap:13px}
.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:.82rem;color:var(--muted);font-weight:850;line-height:1.3}
.control{
  width:100%;
  border:1.5px solid var(--line);
  border-radius:var(--radius-sm);
  background:#f8fbfd;
  color:var(--ink);
  padding:12px 13px;
  min-height:48px;
  outline:0;
  transition:border-color .15s,box-shadow .15s,background .15s,transform .15s;
}
.control:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(10,92,138,.12);background:#fff}
.control.invalid{border-color:var(--red);background:#fff7f6}
select.control{cursor:pointer}
.hidden-extra{display:none;margin-top:8px}.hidden-extra.show{display:block;animation:softRise .15s ease}
.field-error{display:none;color:var(--red);font-size:.78rem;font-weight:850;line-height:1.35}
.field-error.show{display:block}
.visit-toggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:15px}
.visit-toggle label{position:relative;min-width:0}
.visit-toggle input{position:absolute;opacity:0;pointer-events:none}
.visit-choice{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:48px;
  border:1.5px solid var(--line);
  background:#f8fbfd;
  color:var(--muted);
  border-radius:999px;
  font-weight:900;
  transition:background .15s,border-color .15s,color .15s,transform .15s,box-shadow .15s;
}
.choice-code{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  min-width:32px;
  height:25px;
  border-radius:999px;
  background:#e8f4fb;
  color:var(--brand);
  font-size:.72rem;
  font-weight:950;
}
.visit-toggle input:checked+.visit-choice{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 10px 20px rgba(10,92,138,.15)}
.visit-toggle input:checked+.visit-choice .choice-code{background:#fff;color:var(--brand)}
.submit-btn:active,.voice-btn:active,.rating-pill:active{transform:scale(.98)}
.rating-list{display:grid;gap:12px}
.rating-row{
  display:block;
  width:100%;
  min-width:0;
  min-inline-size:0;
  border:1.5px solid var(--line);
  border-radius:16px;
  padding:12px 12px 13px;
  background:#f9fcfe;
  overflow:hidden;
}
.rating-row.done{border-color:#a5dbc3;background:var(--green-soft)}
.rating-row legend{
  display:flex;
  align-items:center;
  gap:8px;
  width:auto;
  max-width:100%;
  margin:0 0 10px;
  padding:0 7px 0 0;
  font-weight:900;
  font-size:.94rem;
  color:var(--ink);
  line-height:1.28;
  white-space:normal;
}
.rating-row legend::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  min-width:8px;
  border-radius:50%;
  background:var(--brand);
}
.rating-options{
  display:grid;
  grid-template-columns:repeat(5,minmax(108px,1fr));
  gap:9px;
  width:100%;
  min-width:0;
}
.rating-options.rating-count-4{grid-template-columns:repeat(4,minmax(118px,1fr))}
.rating-options label{position:relative;display:block;min-width:0}
.rating-options input{position:absolute;opacity:0;pointer-events:none}
.rating-pill{
  display:flex;
  min-height:50px;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  border:1.5px solid var(--line);
  background:#fff;
  color:var(--muted);
  border-radius:14px;
  padding:9px 10px;
  font-size:.82rem;
  line-height:1.2;
  text-align:left;
  font-weight:850;
  transition:background .15s,color .15s,border-color .15s,transform .15s,box-shadow .15s;
}
.rating-icon{
  width:22px;
  height:22px;
  min-width:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#eef5f9;
  color:var(--brand);
  font-size:.78rem;
  font-weight:950;
  line-height:1;
}
.rating-text{
  display:inline-block;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  overflow-wrap:normal;
  word-break:normal;
}
html[lang="ta"] .rating-pill{font-size:.78rem;line-height:1.25}
html[lang="ta"] .rating-text{white-space:normal;overflow:visible;text-overflow:clip;word-break:keep-all;overflow-wrap:normal;hyphens:none}
.rating-options input:checked+.rating-pill{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 8px 17px rgba(10,92,138,.16);transform:translateY(-1px)}
.rating-options input:checked+.rating-pill .rating-icon{background:#fff;color:var(--brand)}
.recommend-box{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1.5px solid var(--line);border-radius:16px;background:#f9fcfe;padding:12px;margin-bottom:6px}
.recommend-box legend{font-weight:900;font-size:.92rem;margin-right:8px;color:var(--ink);line-height:1.35}
.recommend-box label{position:relative;min-width:0}.recommend-box input{position:absolute;opacity:0;pointer-events:none}
.recommend-box span{display:inline-flex;align-items:center;gap:7px;min-width:92px;justify-content:center;border:1.5px solid var(--line);border-radius:999px;padding:9px 16px;background:#fff;color:var(--muted);font-weight:900}
.recommend-box strong{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;border-radius:50%;background:#eef5f9;color:var(--brand);font-size:.78rem;line-height:1}
.recommend-box input:checked+span{background:var(--green);border-color:var(--green);color:#fff}
.recommend-box input:checked+span strong{background:#fff;color:var(--green)}
.recommend-box label:last-child input:checked+span{background:var(--red);border-color:var(--red)}
.recommend-box label:last-child input:checked+span strong{color:var(--red)}
.textarea-field textarea{min-height:96px;resize:vertical;line-height:1.55}
.voice-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:2px}
.voice-btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;background:var(--green);color:#fff;padding:10px 14px;font-weight:900;box-shadow:0 10px 20px rgba(26,140,107,.17)}
.voice-btn[disabled]{opacity:.58;cursor:not-allowed;box-shadow:none}.voice-btn.recording{background:var(--red)}
.mic-dot{width:10px;height:10px;border-radius:50%;background:#fff;display:inline-block}.voice-btn.recording .mic-dot{animation:pulse 1.15s infinite}
.voice-status{color:var(--muted);font-size:.8rem;font-weight:800;flex:1;min-width:190px;line-height:1.35}.char-count{color:var(--muted);font-size:.8rem;font-weight:800;margin-left:auto}
.submit-panel{padding:18px 20px 22px;text-align:center;background:linear-gradient(180deg,#fff,#f8fbfd)}
.submit-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--green),#137456);
  color:#fff;
  padding:0 28px;
  min-width:210px;
  font-weight:950;
  box-shadow:0 14px 26px rgba(26,140,107,.22);
  transition:transform .15s,opacity .15s;
}
.submit-btn[disabled]{opacity:.68;cursor:wait}.submit-btn.secondary{background:var(--brand);box-shadow:0 14px 26px rgba(10,92,138,.2);margin-top:14px}
.submit-panel p{color:var(--muted);font-size:.8rem;margin-top:10px;font-weight:700}
.sticky-progress{
  position:fixed;
  left:50%;
  bottom:12px;
  transform:translateX(-50%);
  width:min(920px,calc(100% - 24px));
  z-index:50;
  display:grid;
  grid-template-columns:auto minmax(120px,1fr) auto;
  gap:12px;
  align-items:center;
  background:rgba(255,255,255,.95);
  border:1px solid var(--line);
  border-radius:20px;
  padding:10px 12px;
  box-shadow:0 16px 36px rgba(12,57,86,.18);
  backdrop-filter:blur(12px);
}
.sticky-info{display:flex;align-items:center;gap:8px;min-width:0}.sticky-info strong{color:var(--brand);font-size:1rem}.sticky-info span{color:var(--muted);font-size:.78rem;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}
.progress-track{height:10px;background:#e5eef4;border-radius:999px;overflow:hidden}.progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--brand-2));border-radius:999px;transition:width .22s ease}
.sticky-progress button{border-radius:999px;background:var(--brand);color:#fff;font-size:.82rem;font-weight:950;padding:10px 14px;white-space:nowrap}
.loading-overlay{position:fixed;inset:0;background:rgba(12,39,57,.48);z-index:80;display:flex;align-items:center;justify-content:center;padding:20px}.loading-overlay[hidden]{display:none}.loader-card{background:#fff;border-radius:20px;padding:24px 28px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.24);min-width:230px}.spinner{width:38px;height:38px;border-radius:50%;border:4px solid #dce9f1;border-top-color:var(--brand);display:inline-block;animation:spin .75s linear infinite}.loader-card p{margin-top:10px;color:var(--brand);font-weight:900}
.success-card{text-align:center;padding:36px 24px;margin-top:20px}.success-mark{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--green-soft);color:var(--green);font-size:2.4rem;font-weight:950;margin:0 auto 12px}.success-card h2{color:var(--brand);font-size:1.35rem;margin-bottom:6px}.success-card p{color:var(--muted);font-weight:700}
.hp-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0!important}
@keyframes softRise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pulse{50%{box-shadow:0 0 0 9px rgba(255,255,255,.2)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:900px){
  .rating-options{grid-template-columns:repeat(5,minmax(96px,1fr))}
  .rating-options.rating-count-4{grid-template-columns:repeat(4,minmax(108px,1fr))}
}
@media (max-width:760px){
  body{font-size:14px;padding-bottom:116px}
  .site-header{padding:14px 12px 24px}
  .brand-card{align-items:flex-start}
  .logo-box{width:128px;min-width:128px;height:48px;border-radius:14px}
  .brand-copy h1{font-size:1.15rem}
  .brand-copy p:last-child{font-size:.8rem}
  .page-shell{padding:0 10px 18px}
  .hero-panel{grid-template-columns:1fr;padding:16px}
  .lang-switch{justify-self:start}
  .form-section{padding:16px 14px}
  .section-title{gap:8px;margin-bottom:12px}
  .step-dot,.section-icon{width:29px;height:29px;min-width:29px;border-radius:10px}
  .two-col{grid-template-columns:1fr}
  .visit-toggle{grid-template-columns:1fr 1fr}
  .rating-list{gap:10px}
  .rating-row{padding:11px;border-radius:15px}
  .rating-row legend{font-size:.92rem;margin-bottom:9px}
  .rating-options,.rating-options.rating-count-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .rating-options label.is-na{grid-column:1 / -1}
  .rating-pill{min-height:46px;font-size:.79rem;justify-content:flex-start;text-align:left;padding:8px 10px}
  .rating-icon{width:21px;height:21px;min-width:21px}
  .recommend-box{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .recommend-box legend{grid-column:1/-1;margin-right:0}
  .recommend-box span{width:100%;min-width:0}
  .sticky-progress{grid-template-columns:1fr auto;gap:8px}
  .sticky-progress .progress-track{grid-column:1/-1;grid-row:2}
  .sticky-info span{max-width:180px}
  .sticky-progress button{padding:10px 13px}
  .submit-btn{width:100%;min-width:0}
  .char-count{margin-left:0}
  .voice-status{min-width:0;flex-basis:100%}
}
@media (max-width:430px){
  .brand-card{gap:10px}
  .logo-box{width:110px;min-width:110px;height:44px}
  .brand-copy .eyebrow{font-size:.65rem}
  .brand-copy h1{font-size:1.02rem}
  .brand-copy p:last-child{font-size:.74rem}
  .hero-panel h2{font-size:1.12rem}
  .visit-toggle{grid-template-columns:1fr}
  .rating-options,.rating-options.rating-count-4{grid-template-columns:1fr 1fr}
  .rating-pill{font-size:.76rem;gap:7px}
  html[lang="ta"] .rating-pill{font-size:.73rem}
  .sticky-info span{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
