/* VINEA CRETA / DISCOVER — EDITORIAL EDITION
   Separate presentation layer to preserve the tasting engine and all existing interactions.
   Type scale: 12–13px tertiary | 14–16px supporting | 17–19px body | 34–70px headings.
*/
:root {
  --gold: #c7a36b;
  --gold2: #e3c58f;
  --bg: #080807;
  --panel: #11100e;
  --soft: #e5dfd5;
  --muted: #b2a99b;
  --border: rgba(204,167,110,.22);
  --serif: 'Noto Serif Display', Georgia, 'Times New Roman', serif;
  --sans: 'Noto Sans', Arial, sans-serif;
  --page-x: clamp(22px, 5.2vw, 96px);
  --page-y: clamp(36px, 5.4vw, 88px);
}
html { font-size: 16px; }
body, button, input {font-family:var(--sans);}
body {
  color:var(--soft);
  font-weight:400;
  line-height:1.65;
  background:
    radial-gradient(ellipse 66% 46% at 90% 17%,rgba(126,89,43,.105),transparent 70%),
    radial-gradient(ellipse 44% 60% at 8% 95%,rgba(101,78,46,.075),transparent 72%),
    #080807;
}
button, a { -webkit-tap-highlight-color:transparent; }
:where(button,a,input):focus-visible {outline:2px solid var(--gold2);outline-offset:4px;}
::selection{background:#d4af78;color:#110d08}
.grain{opacity:.038}

/* Header — a quiet, anchored frame around the experience */
.topbar {
  --header-desktop:100px;
  height:100px;
  min-height:100px;
  grid-template-columns:minmax(230px,1fr) auto minmax(135px,1fr);
  border-bottom:1px solid rgba(211,172,112,.16);
  background:rgba(8,8,7,.95);
  padding-block:12px;
  gap:26px;
}
.logo-main{width:78px;max-height:70px}
.brand-lockup{gap:19px}
.brand-copy{gap:5px}
.brand-copy span,.mode-kicker,.console-kicker,.lab-kicker{
  font-family:var(--sans);font-size:.72rem;letter-spacing:.26em;
  font-weight:500;color:var(--gold2);
}
.brand-copy strong{font-family:var(--serif);font-size:1.24rem;line-height:1.3;letter-spacing:-.025em;color:#f6efe5}
.ecosystem-nav{gap:clamp(18px,2.2vw,36px)}
.ecosystem-nav a{
  font-family:var(--sans);font-size:.74rem;font-weight:500;letter-spacing:.105em;
  color:#bcb5a9; padding:10px 0 13px;
}
.ecosystem-nav a.active{color:#e6c48d}
.ecosystem-nav a::after{height:1px;background:#dcb87e}
.reset-link,.back-btn{
  color:#dfbd88;font-family:var(--sans);font-size:.73rem;font-weight:600;
  letter-spacing:.13em;line-height:1.5;
}
.reset-link:hover,.back-btn:hover{color:#fff}
.stage,.screen{min-height:calc(100vh - 100px);min-height:calc(100dvh - 100px)}
.screen{padding:var(--page-y) var(--page-x)}
.screen.active{animation:premiumAppear .48s ease-out}
@keyframes premiumAppear{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}

/* Unified editorial heading system, with reliable Greek/Russian coverage. */
h1,h2,h3,.language-title,.mode-panel h2,.console-head h2,.lab-head h2,
.result-name,.console-name,.result-card .match-number {
  font-family:var(--serif);font-weight:400;letter-spacing:-.035em;
}
h1{font-size:clamp(4rem,6.5vw,7.25rem);line-height:1.09;letter-spacing:-.055em}
h2{font-size:clamp(2.45rem,4.3vw,4.5rem);line-height:1.18;letter-spacing:-.045em}
.eyebrow{
  font-family:var(--sans);font-size:clamp(.74rem,.87vw,.84rem);font-weight:600;
  line-height:1.6;letter-spacing:.26em;color:var(--gold2);margin-bottom:18px;
}
.gold-rule{width:min(500px,85%);margin:28px 0;background:linear-gradient(90deg,#dbbc83,rgba(204,167,110,.25),transparent)}
.lead,.question-sub,.curating-wrap p{
  color:#c9c1b6;font-family:var(--sans);
  font-size:clamp(1.04rem,1.35vw,1.2rem);line-height:1.83;letter-spacing:0;
  font-weight:400;
}
.question-main h2{max-width:1160px;text-wrap:balance}
.question-sub{max-width:850px;margin-top:17px;margin-bottom:0}

/* Language portal */
.language-gate{
  background:
    radial-gradient(ellipse 48% 38% at 50% 36%,rgba(148,107,62,.115),transparent 78%),
    #080807;
}
.language-panel{width:min(1120px,100%);padding-block:28px}
.language-logo{width:134px;max-width:34vw;margin-bottom:23px;filter:drop-shadow(0 0 25px rgba(189,151,88,.18))}
.language-panel>.eyebrow{font-size:.8rem;margin-bottom:8px}
.language-title{
  font-size:clamp(2.8rem,5.15vw,5rem);line-height:1.24;color:#f7f0e8;
  margin-top:24px;
}
.language-rule{width:min(610px,84%);margin:28px auto 35px;background:linear-gradient(90deg,transparent,rgba(222,182,120,.85),transparent)}
.language-grid{gap:13px}
.language-grid button{
  position:relative; min-height:86px;padding:18px 12px;
  border:1px solid rgba(212,172,112,.25);
  background:linear-gradient(145deg,rgba(255,255,255,.025),transparent),#12100e;
  font-family:var(--sans);font-size:.86rem;font-weight:600;letter-spacing:.11em;
  color:#e9e3d9;transition:transform .25s,border-color .25s,background .25s;
}
.language-grid button:hover,.language-grid button:focus-visible{background:#1b1712;border-color:#d9b77f;transform:translateY(-2px)}

/* Intro hero */
.intro-layout{grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(46px,7vw,120px)}
.intro-visual{min-height:450px}
.intro-copy{max-width:790px}
.intro-copy .lead{max-width:660px}
.hero-landscape{border-color:rgba(208,168,105,.23);box-shadow:inset 0 -46px 80px rgba(0,0,0,.4),0 32px 100px rgba(0,0,0,.28),0 0 95px rgba(176,141,87,.065)}
.gold-btn{
  margin-top:32px;min-width:min(100%,325px);padding:18px 32px;
  border:1px solid #c6a36c;
  background:linear-gradient(100deg,#d6b47e,#c39a5f);color:#1a130b;
  font-family:var(--sans);font-size:.82rem;font-weight:700;letter-spacing:.12em;
  line-height:1.6;box-shadow:0 15px 36px rgba(0,0,0,.2);
  transition:transform .25s ease,background .25s ease,box-shadow .25s ease;
}
.gold-btn:hover{background:linear-gradient(100deg,#e9c997,#d3aa6e);transform:translateY(-2px);box-shadow:0 18px 38px rgba(0,0,0,.28)}

/* Selection gateway: readable, editorial, restrained. */
.mode-overlay,.lab-overlay,.console-overlay {
  background:radial-gradient(ellipse 52% 35% at 50% 2%,rgba(145,104,57,.085),transparent 76%),#080807;
}
.mode-panel{width:min(1140px,calc(100% - 32px));display:flex;flex-direction:column;justify-content:center;min-height:100dvh;padding-top:clamp(36px,6vh,80px)}
.mode-panel h2{font-size:clamp(2.9rem,4.6vw,4.65rem);line-height:1.19;margin:17px auto 8px;max-width:950px;text-wrap:balance}
.mode-kicker{font-size:.75rem;letter-spacing:.27em}
.mode-lead{
  color:#c2b9aa;font-family:var(--sans);font-size:clamp(.96rem,1.2vw,1.1rem);
  line-height:1.8;letter-spacing:0;max-width:690px;margin-inline:auto;
}
.mode-ecosystem-nav{margin-block:21px 27px!important}
.mode-cards{gap:20px;margin-top:44px}
.mode-card{
  min-height:254px;padding:33px 36px 46px;
  background:linear-gradient(140deg,rgba(206,165,106,.045),transparent 55%),#11100e;
  border:1px solid rgba(210,170,109,.27);
}
.mode-num{font-family:var(--serif);font-size:.98rem;color:#d9b780}
.mode-card h3{
  margin:21px 0 11px;font-family:var(--sans);font-size:clamp(1.04rem,1.4vw,1.22rem);
  font-weight:600;line-height:1.5;letter-spacing:.105em;color:#f7f1e8;
}
.mode-card p{
  font-family:var(--sans);font-size:clamp(.92rem,1vw,1.02rem);line-height:1.8;
  letter-spacing:0;color:#c1b8a9;max-width:430px;margin-top:8px;margin-bottom:0;
}
.mode-arrow{right:28px;bottom:25px;font-size:1.45rem;color:#dfbc80}

/* Guided tasting */
.question-frame{width:min(1420px,100%);grid-template-columns:92px 1fr;gap:clamp(36px,4.5vw,80px)}
.question-main{padding-top:4px}
.step-circle{width:70px;height:70px;font-family:var(--serif);font-size:1.7rem;color:#f4eadc}
.step-total{font-size:.83rem;font-weight:600;letter-spacing:.13em}
.choice-grid{margin-top:38px;gap:17px;max-width:1160px}
.choice-card,.choice-inner{min-height:148px}
.choice-card{background:linear-gradient(140deg,rgba(191,149,88,.03),transparent 55%),#11100e;border-color:rgba(202,160,100,.27)}
.choice-inner{grid-template-columns:50px minmax(0,1fr) 43px;column-gap:20px;padding:25px 26px}
.choice-index{width:46px;height:46px;font-size:1.05rem;font-family:var(--serif);color:#d4b27c}
.choice-title{
  font-family:var(--sans);font-weight:600;color:#f0e9de;
  font-size:clamp(1rem,1.18vw,1.13rem);letter-spacing:.09em;line-height:1.5;
  max-width:none;overflow-wrap:anywhere;
}
.choice-note{
  font-family:var(--sans);font-size:clamp(.88rem,1vw,.98rem);line-height:1.7;
  font-weight:400;letter-spacing:0;color:#bfb5a6;max-width:none;
}
.choice-arrow{width:40px;height:40px;color:#d9b780;font-size:1.17rem}
.choice-confirm{font-size:.67rem;letter-spacing:.12em}
.back-btn{margin-top:22px}

/* Matching results */
.results-wrap{width:min(1420px,100%)}
.results-sub{margin-top:18px}
.podium{margin-top:48px;gap:18px}
.result-card{min-height:480px;padding:clamp(24px,2vw,34px);border-color:rgba(202,160,100,.24);background:linear-gradient(150deg,rgba(196,152,90,.055),transparent 45%),#11100e}
.result-card.primary{min-height:510px;border-color:rgba(221,181,117,.68)}
.result-rank{font-family:var(--sans);font-size:.75rem;font-weight:600;letter-spacing:.17em}
.result-name{font-size:clamp(1.85rem,2.15vw,2.4rem);line-height:1.24;margin-top:20px}
.result-tags{font-family:var(--sans);font-size:.77rem;letter-spacing:.11em;line-height:1.8}
.match-number{font-size:2.6rem}
.match-label,.best-with strong{font-family:var(--sans);font-size:.73rem;letter-spacing:.12em;color:#d8b67c}
.result-reason{font-family:var(--sans);font-size:1rem;line-height:1.78;color:#d2c9bb}
.best-with span{font-family:var(--sans);font-size:.93rem;line-height:1.78;color:#cbc1b3}
.curating-wrap p{margin-inline:auto}

/* Taste console: labels, values, and pairings no longer microscopic. */
.console-panel{max-width:1380px;padding-top:clamp(30px,4.8vh,58px)}
.console-head{margin-bottom:28px}
.console-head h2{font-size:clamp(2.45rem,4vw,4.2rem);line-height:1.2;margin:12px 0 9px}
.console-head p{font-family:var(--sans);font-size:1.01rem;line-height:1.78;letter-spacing:0;color:#c9bfb0;max-width:770px}
.console-kicker{font-size:.75rem}
.console-layout{max-width:1210px;gap:28px!important;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)!important}
.console-controls{padding:17px 24px!important;background:#11100e;border:1px solid rgba(210,170,109,.25)}
.taste-row{grid-template-columns:165px minmax(0,1fr) 84px!important;gap:18px!important;padding:14px 0!important}
.taste-label{font-family:var(--sans);font-size:.85rem!important;font-weight:600;letter-spacing:.055em;line-height:1.5;color:#ece5d9}
.taste-slider-wrap{min-height:44px}
.taste-slider{height:3px}
.taste-slider::-webkit-slider-thumb{width:23px;height:23px}
.taste-slider::-moz-range-thumb{width:23px;height:23px}
.taste-scale{font-family:var(--sans);font-size:.68rem;line-height:1.5;color:#a99e90}
.taste-value{font-family:var(--serif);font-size:1.45rem!important;line-height:1.2;color:#e4be84}
.taste-word{font-family:var(--sans);font-size:.67rem!important;line-height:1.45;letter-spacing:0;text-transform:none;color:#bdb2a1}
.console-live-title{font-family:var(--sans);font-size:.8rem;font-weight:600;letter-spacing:.17em;margin-bottom:17px;color:#e3c28b}
.console-card{
  grid-template-columns:43px minmax(0,1fr) 82px!important;
  min-height:0;padding:20px 23px!important;margin-top:0;margin-bottom:13px;
  border:1px solid rgba(205,166,106,.23);background:#11100e;
}
.console-card.primary{border-color:rgba(221,181,117,.67)!important}
.console-rank{font-size:.81rem!important;letter-spacing:.07em!important;color:#dbb779}
.console-name{font-family:var(--serif);font-size:clamp(1.25rem,1.55vw,1.58rem)!important;letter-spacing:-.025em!important;line-height:1.34!important;color:#f4ebe0}
.console-fit{font-family:var(--serif);font-size:1.65rem!important}
.console-fit small{font-family:var(--sans);font-size:.7rem;letter-spacing:0;text-transform:none;color:#bdb2a1}
.console-bar{margin-top:6px;height:3px}
.console-reason{font-family:var(--sans);font-size:.86rem;letter-spacing:0;line-height:1.55;color:#b9ae9e}
.console-pair{margin-top:9px!important;padding-top:13px!important}
.console-pair strong{font-family:var(--sans);font-size:.75rem;letter-spacing:.13em;color:#dfb982}
.console-pair span{font-family:var(--sans);font-size:.94rem!important;line-height:1.65!important;color:#d1c6b7}
.console-actions{gap:12px;margin-top:30px;flex-wrap:wrap}
.console-btn,.lab-btn{
  font-family:var(--sans);font-size:.8rem;font-weight:600;letter-spacing:.09em;
  min-height:47px;padding:11px 20px;border-color:rgba(220,178,116,.42);color:#e0c9aa;
}

/* Compatibility if older radar experience is surfaced. */
.lab-head h2{font-size:clamp(2.5rem,4vw,4.3rem)}
.lab-head p{font-size:1rem;line-height:1.75;letter-spacing:0;color:#c7bdaf}
.lab-results-title{font-size:.83rem;letter-spacing:.14em}
.live-name{font-size:1rem;letter-spacing:.06em}
.live-reason{font-size:.85rem;line-height:1.6;letter-spacing:0;color:#b5ab9e}
.live-pct{font-family:var(--serif);font-size:1.55rem}
.live-pct small{font-family:var(--sans);font-size:.68rem}

@media(max-width:1100px){
  .topbar{grid-template-columns:minmax(180px,1fr) auto minmax(90px,1fr);gap:12px}
  .brand-copy span{font-size:.65rem}
  .brand-copy strong{font-size:1.11rem}
  .ecosystem-nav{gap:15px}
  .ecosystem-nav a{font-size:.68rem;letter-spacing:.07em}
  .console-layout{grid-template-columns:1fr!important;max-width:780px}
  .console-head p{max-width:650px}
}
@media(max-width:900px){
  .topbar{height:auto;min-height:0;padding:12px var(--page-x) 10px;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}
  .topbar>.ecosystem-nav{gap:14px;padding-top:9px}
  .stage,.screen{min-height:calc(100vh - 130px);min-height:calc(100dvh - 130px)}
  .intro-layout{grid-template-columns:1fr;gap:26px;text-align:center}
  .intro-visual{min-height:290px}
  .intro-copy{margin-inline:auto}
  .gold-rule{margin-inline:auto}
  .lead{margin-inline:auto}
  .question-frame{grid-template-columns:1fr}
  .podium{grid-template-columns:1fr;max-width:720px;margin-inline:auto}
  .result-card.primary{order:-1;transform:none}
  .mode-cards{gap:15px}
  .mode-card{padding:27px 27px 38px}
  .taste-row{grid-template-columns:165px minmax(0,1fr) 82px!important}
}
@media(max-width:700px){
  :root{--page-x:20px;--page-y:32px}
  .topbar{padding:11px 18px 9px}
  .brand-copy{display:none}
  .logo-main{width:62px;max-height:55px}
  .topbar>.ecosystem-nav{justify-content:flex-start;gap:20px}
  .topbar>.ecosystem-nav a{font-size:.69rem;letter-spacing:.055em;padding-bottom:8px}
  .reset-link{font-size:.75rem;letter-spacing:.07em;padding:10px 2px}
  .stage,.screen{min-height:calc(100vh - 118px);min-height:calc(100dvh - 118px)}
  .screen{padding:32px 20px 44px}
  h1{font-size:clamp(3.2rem,13vw,5.5rem);line-height:1.12}
  h2{font-size:clamp(2.2rem,9vw,3.4rem);line-height:1.25}
  .eyebrow{font-size:.73rem;letter-spacing:.18em;margin-bottom:15px}
  .lead,.question-sub{font-size:1.02rem;line-height:1.8}
  .intro-visual{min-height:260px}
  .hero-landscape{width:min(335px,90%)}
  .gold-btn{width:100%;max-width:370px;margin-top:28px}
  .language-panel{padding:20px 0}
  .language-logo{width:116px}
  .language-title{font-size:clamp(2.45rem,9vw,3.6rem)}
  .language-grid{grid-template-columns:1fr 1fr;gap:11px}
  .language-grid button{min-height:66px;font-size:.78rem;letter-spacing:.07em}
  .language-grid button:last-child{grid-column:1/-1}
  .mode-panel,.console-panel,.lab-panel{width:calc(100% - 24px);padding-top:36px;padding-bottom:38px}
  .mode-panel h2{font-size:clamp(2.25rem,8vw,3.6rem)}
  .mode-lead{font-size:.98rem;line-height:1.75}
  .mode-cards{grid-template-columns:1fr;margin-top:29px;gap:13px}
  .mode-card{min-height:190px;padding:22px 24px 33px}
  .mode-card h3{font-size:1.05rem;margin:12px 0 7px}
  .mode-card p{font-size:.93rem;line-height:1.68;margin:0;max-width:90%}
  .mode-arrow{right:21px;bottom:18px}
  .question-frame{gap:0}
  .question-main h2{font-size:clamp(2.18rem,8vw,3.25rem)}
  .choice-grid{margin-top:29px;grid-template-columns:1fr;gap:12px}
  .choice-card,.choice-inner{min-height:128px}
  .choice-inner{grid-template-columns:42px minmax(0,1fr) 30px;column-gap:12px;padding:18px 15px}
  .choice-index{width:39px;height:39px;font-size:.99rem}
  .choice-title{font-size:.98rem;letter-spacing:.055em}
  .choice-note{font-size:.88rem;line-height:1.6;margin-top:4px}
  .choice-arrow{width:30px;height:30px;font-size:1rem}
  .choice-confirm{display:none}
  .result-card,.result-card.primary{min-height:0;padding:25px}
  .result-reason{font-size:.96rem}
  .console-head h2{font-size:clamp(2.25rem,8vw,3.2rem)}
  .console-head p{font-size:.96rem}
  .console-controls{padding:14px 18px!important}
  .taste-row{grid-template-columns:minmax(0,1fr) 70px!important;gap:3px 12px!important;padding:12px 0!important}
  .taste-label{grid-column:1;font-size:.87rem!important}
  .taste-row>div:nth-child(2){grid-column:1/-1;grid-row:2}
  .taste-value{grid-column:2;grid-row:1;text-align:right;font-size:1.25rem!important}
  .taste-word{font-size:.65rem!important}
  .taste-scale{font-size:.67rem}
  .taste-slider-wrap{min-height:40px}
  .console-live-title{margin-top:8px}
  .console-card{grid-template-columns:26px minmax(0,1fr) 72px!important;padding:18px 16px!important;gap:11px}
  .console-name{font-size:1.2rem!important}
  .console-fit{font-size:1.3rem!important}
  .console-reason{font-size:.82rem}
  .console-pair span{font-size:.88rem!important}
  .console-actions{justify-content:stretch}
  .console-btn{flex:1;min-width:calc(50% - 8px)}
}
@media(max-width:410px){
  .topbar>.ecosystem-nav{gap:14px}
  .topbar>.ecosystem-nav a{font-size:.63rem}
  .mode-panel h2{font-size:2.34rem}
  .mode-card p{max-width:93%}
  .choice-inner{grid-template-columns:38px minmax(0,1fr) 26px;column-gap:10px;padding:17px 13px}
  .choice-index{width:36px;height:36px}
  .console-card{grid-template-columns:22px minmax(0,1fr) 65px!important;gap:9px}
  .console-name{font-size:1.11rem!important}
}
@media(prefers-reduced-motion:reduce){
  .screen.active{animation:none!important}
  *,*::before,*::after{scroll-behavior:auto!important}
}

/* Keep the background document out of view and out of the tab order
   when a modal tasting path is open. The overlays have their own scroll. */
body:has(.language-gate:not(.hidden)),
body:has(.mode-overlay.show),
body:has(.lab-overlay.show),
body:has(.console-overlay.show){overflow:hidden}
body:has(.language-gate:not(.hidden)) .app-shell,
body:has(.mode-overlay.show) .app-shell,
body:has(.lab-overlay.show) .app-shell,
body:has(.console-overlay.show) .app-shell{display:none}
.mode-overlay,.lab-overlay,.console-overlay{-webkit-overflow-scrolling:touch}

@media(max-width:420px){.ecosystem-nav{gap:9px!important}.ecosystem-nav a{font-size:.60rem!important;letter-spacing:0!important}}