/* NameVerity Grand Design V2 — four-vertical visual transformation.
   Staging-only, reversible by removing ONE link in base.html.
   Does not alter native logos, hidden states, control semantics, routes, or JS. */
:root{--nv-ink:#162c48;--nv-shadow:0 18px 52px rgba(20,38,61,.12);--nv-ring:#285d88}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat){
 --nv-border:rgba(39,71,103,.18);
 --nv-ground:#f8f5ef;
 --nv-veil:rgba(255,255,255,.89);
 --nv-tint:#d7e6ef;
 --nv-vivid:#467795;
}
.vertical-baby{--nv-tint:#dce4f2;--nv-vivid:#477393;--nv-ground:#f6f5f6}
.vertical-pet{--nv-tint:#d9e7d9;--nv-vivid:#347469;--nv-ground:#f8f4e8}
.vertical-business{--nv-tint:#dae8ed;--nv-vivid:#345d79;--nv-ground:#f7f5f1}
.vertical-boat{--nv-tint:#b9d9e4;--nv-vivid:#d6a96e;--nv-ground:#10273e}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) :is(.baby-question,.pet-question,.business-question,.boat-question):not([hidden]){
 border-radius:28px;
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat)
:is(.baby-choice,.pet-choice-card,.business-choice-card,.boat-choice-card){
 border-radius:22px;
 box-shadow:0 9px 25px rgba(23,46,67,.09);
 transition:box-shadow .22s ease,transform .22s ease,border-color .22s ease;
}
@media(hover:hover){
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat)
:is(.baby-choice,.pet-choice-card,.business-choice-card,.boat-choice-card):hover{
 transform:translateY(-2px);box-shadow:0 18px 40px rgba(23,46,67,.16)
}}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat)
:is(.baby-choice,.pet-choice-card,.business-choice-card,.boat-choice-card):focus-visible{
 outline:3px solid #286a9b;outline-offset:3px
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat)
:is(.baby-progress-track,.pet-progress-track,.business-progress-track,.boat-progress-track){
 border-radius:99px;overflow:hidden;
 box-shadow:inset 0 1px 3px rgba(33,52,72,.1)
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat)
:is(.baby-progress-track,.pet-progress-track,.business-progress-track,.boat-progress-track)>span{
 background:linear-gradient(90deg,var(--nv-vivid),#8ab5c8);border-radius:99px
}
.vertical-baby .baby-question-kicker{color:#3b6c8e}
.vertical-baby .baby-kicker-heart{opacity:.55}
.vertical-baby .baby-question-gender .baby-question-heading h2{color:#193455}
.vertical-baby .baby-question-gender .baby-choice-illustrated{
 background:linear-gradient(118deg,rgba(255,255,255,.96),rgba(233,241,247,.93) 51%,rgba(235,220,236,.8));
 border:1px solid rgba(82,122,162,.3);
 box-shadow:0 13px 35px rgba(64,89,121,.13)
}
.vertical-baby .baby-question-gender .baby-choice-illustrated.is-selected,
.vertical-baby .baby-question-gender .baby-choice-illustrated[aria-checked="true"]{
 border-color:#406f91;box-shadow:0 0 0 2px rgba(64,111,145,.3),0 16px 40px rgba(44,76,104,.17)
}
.vertical-baby .baby-question-gender .baby-choice-illustrated .baby-choice-chevron{color:#416f91}
:is(.vertical-pet,.vertical-business) :is(.pet-choice-card,.business-choice-card){
 background:linear-gradient(120deg,#fff,rgba(235,245,245,.94));
 border-color:var(--nv-border)
}
.vertical-pet .pet-choice-card:nth-child(odd){background:linear-gradient(120deg,#fffaf3,#e3eee9)}
.vertical-business .business-choice-card:nth-child(odd){background:linear-gradient(120deg,#fffdf9,#dfe9f2)}
.vertical-boat .boat-choice-card{
 background:linear-gradient(115deg,rgba(20,49,78,.96),rgba(37,79,111,.92));
 border-color:rgba(178,205,219,.37);
 box-shadow:0 14px 42px rgba(0,9,23,.27)
}
.vertical-boat .boat-choice-card:is(.is-selected,[aria-checked="true"]){border-color:#e2bd82;box-shadow:0 0 0 2px rgba(226,189,130,.25),0 19px 47px rgba(0,9,23,.37)}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .results-shell{
 --nv-card-radius:24px;
}
:is(.vertical-baby,.vertical-pet,.vertical-business) .results-shell{
 background:linear-gradient(135deg,rgba(252,250,246,.55),rgba(226,237,245,.34))
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .results-heading h1{
 font-family:"Cormorant Garamond",Georgia,serif;
 text-wrap:balance;letter-spacing:-.025em
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card{
 position:relative;
 overflow:hidden;
 border-radius:24px;
 border:1px solid var(--nv-border);
 box-shadow:var(--nv-shadow);
 isolation:isolate;
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card::before{
 content:"";position:absolute;inset:0 0 auto 0;height:11px;
 background:linear-gradient(90deg,var(--nv-vivid),var(--nv-tint),transparent);
 opacity:.88;pointer-events:none;z-index:0
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card-main{
 position:relative;z-index:1;
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card h2{
 font-family:"Cormorant Garamond",Georgia,serif;
 letter-spacing:-.025em
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-tags span{
 border-radius:99px
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card :is(button,a):focus-visible{
 outline:3px solid var(--nv-ring);outline-offset:3px
}
.vertical-baby .result-card{background:linear-gradient(115deg,#fffefa 0%,#f0f6fb 69%,#f6eaf3 100%)}
.vertical-baby .result-card:nth-child(3n+2){background:linear-gradient(115deg,#fffefa 0%,#eaf2fa 78%,#d5e5f2 100%)}
.vertical-baby .result-card:nth-child(3n){background:linear-gradient(115deg,#fffefa 0%,#f1edfa 75%,#e8dcef 100%)}
.vertical-pet .result-card{background:linear-gradient(120deg,#fffdf7 0%,#eaf2ea 76%,#d7e9e3 100%)}
.vertical-pet .result-card:nth-child(2n){background:linear-gradient(120deg,#fffdf7 0%,#f4e8d6 81%,#ebd3b9 100%)}
.vertical-business .result-card{background:linear-gradient(120deg,#fff 0%,#e9f1f6 68%,#d4e4ed 100%)}
.vertical-business .result-card:nth-child(2n){background:linear-gradient(120deg,#fffdf9 0%,#eceae2 68%,#e3dccc 100%)}
.vertical-boat .result-card{background:linear-gradient(110deg,#112940,#194268 63%,#285b76 100%);border-color:rgba(198,218,224,.37)}
/* The existing generation progress panels receive editorial pictorial scenes. */
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .progress-panel{
 position:relative;isolation:isolate;overflow:hidden;
 border-radius:28px;
}
:is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .progress-panel::after{
 content:"";position:absolute;inset:0 0 0 auto;width:55%;
 background-position:center;background-repeat:no-repeat;background-size:cover;
 opacity:.26;z-index:-1;pointer-events:none
}
.vertical-baby .progress-panel::after{background-image:url("/static/images/premium/baby-photo.jpg")}
.vertical-pet .progress-panel::after{background-image:url("/static/images/premium/pet-photo.jpg")}
.vertical-business .progress-panel::after{background-image:url("/static/images/premium/business-photo.jpg")}
.vertical-boat .progress-panel::after{background-image:url("/static/images/premium/boat-photo.jpg");opacity:.36}
@media(max-width:670px){
 :is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .result-card{border-radius:20px}
 :is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) :is(.baby-choice,.pet-choice-card,.business-choice-card,.boat-choice-card){border-radius:18px}
 :is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) .progress-panel::after{width:78%;opacity:.17}
}
@media(prefers-reduced-motion:reduce){
 :is(.vertical-baby,.vertical-pet,.vertical-business,.vertical-boat) :is(.baby-choice,.pet-choice-card,.business-choice-card,.boat-choice-card){transition:none;transform:none!important}
}
/* Boat generation: the yacht photograph fills the panel under one navy wash. */
body.vertical-boat .progress-panel::after{
 inset:0;
 width:100%;
 opacity:1;
 background-image:
  linear-gradient(180deg, rgba(7,17,31,.58) 0%, rgba(8,20,38,.64) 36%, rgba(7,17,31,.86) 72%, rgba(7,17,31,.93) 100%),
  url("/static/images/premium/boat-photo.jpg");
 background-repeat:no-repeat;
 background-size:cover;
 background-position:center 42%;
}
body.vertical-boat .progress-panel > *{
 position:relative;
 z-index:1;
}