/* ---------- HUB / forside ---------- */
.hub{
  flex:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  padding: clamp(48px,7vh,96px) 24px clamp(56px,8vh,96px);
  /* forsiden skal eie hele første skjermbilde; JS finjusterer mot faktisk headerhøyde */
  min-height: calc(100vh - 110px);
  min-height: calc(100svh - 110px);
}

.mark{
  width: clamp(64px, 9vw, 100px);
  margin-bottom: clamp(22px, 3vw, 34px);
  opacity:0;
  transform: translateY(10px);
  animation: rise .7s var(--ease) forwards .05s;
}
.mark path{
  stroke-dasharray: 1200;
  stroke-dashoffset: 1200;
  animation: draw 1.1s var(--ease) forwards .15s;
}
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes rise{ to{ opacity:1; transform:translateY(0); } }

.wordmark{
  font-size: clamp(28px, 4.4vw, 46px);
  font-weight:700;
  letter-spacing:.5em;
  margin: 0 0 clamp(14px,2vw,20px);
  padding-left:.5em; /* optically balance letter-spacing */
  opacity:0; transform:translateY(10px);
  animation: rise .7s var(--ease) forwards .06s;
}

.tagline{
  font-size: clamp(13px, 1.4vw, 15px);
  font-weight:300;
  color: var(--cream-dim);
  letter-spacing:.06em;
  max-width: 34ch;
  margin: 0 0 clamp(48px,6vw,72px);
  opacity:0; transform:translateY(10px);
  animation: rise .7s var(--ease) forwards .2s;
}

.choices{
  display:flex; gap: clamp(18px, 3vw, 28px);
  flex-wrap:wrap; justify-content:center;
  opacity:0; transform:translateY(14px);
  animation: rise .8s var(--ease) forwards .32s;
}

.choice{
  position:relative;
  width: clamp(200px, 21vw, 280px);
  padding: clamp(34px,4vw,44px) clamp(26px,3vw,32px);
  border: 1px solid var(--line);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  overflow:hidden;
  text-align:left;
  display:flex; flex-direction:column;
  transition: border-color .5s var(--ease), transform .5s var(--ease), background .5s var(--ease);
  isolation:isolate;
}
.choice-go{ margin-top:auto; align-self:flex-start; }
.choice::before{
  content:'';
  position:absolute; inset:0; z-index:-1;
  background: var(--cream);
  transform: translateY(101%);
  transition: transform .55s var(--ease);
}
.choice:hover{
  border-color: transparent;
  transform: translateY(-4px);
}
.choice:hover::before{ transform:translateY(0); }

.choice-index{
  display:block;
  font-size:11px; letter-spacing:.22em; color:var(--gold);
  margin-bottom:20px;
  transition: color .5s var(--ease);
}
.choice:hover .choice-index{ color:#8A6A2E; }

.choice-title{
  font-size: clamp(24px,2.6vw,30px);
  font-weight:700; letter-spacing:.04em;
  margin:0 0 10px;
  transition: color .5s var(--ease);
}
.choice:hover .choice-title{ color: var(--ink); }

.choice-desc{
  font-size:13px; line-height:1.6; font-weight:300;
  color: var(--cream-dim);
  margin:0 0 26px;
  transition: color .5s var(--ease);
}
.choice:hover .choice-desc{ color: rgba(14,25,38,.72); }

.choice-go{
  display:inline-flex; align-items:center; gap:9px;
  font-size:11px; letter-spacing:.2em; font-weight:600;
  color: var(--cream);
  transition: color .5s var(--ease);
}
.choice:hover .choice-go{ color: var(--ink); }
.choice-go svg{ width:14px; height:14px; transition: transform .4s var(--ease); }
.choice:hover .choice-go svg{ transform: translateX(5px); }

@media (max-width: 560px){
  .choices{ flex-direction:column; }
  .choice{ width:100%; max-width:340px; }
  .wordmark{ letter-spacing:.3em; padding-left:.3em; }
}

/* ---------- AI i salgsarbeidet ---------- */
.ai-band{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(28px,4vw,56px);
  align-items:center;
  border:1px solid var(--line);
  border-radius:2px;
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(201,161,92,.09), rgba(201,161,92,0) 58%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  padding: clamp(30px,4vw,52px);
}
@media (max-width:900px){ .ai-band{ grid-template-columns:1fr; } }

.ai-eyebrow{
  display:flex; align-items:center; gap:10px;
  font-size:11px; letter-spacing:.22em; font-weight:600;
  color:var(--gold); margin:0 0 18px;
}
.ai-dot{
  width:6px; height:6px; border-radius:50%; background:var(--gold);
  box-shadow:0 0 0 0 rgba(201,161,92,.55);
  animation: aiPuls 2.6s var(--ease) infinite;
}
@keyframes aiPuls{
  0%{ box-shadow:0 0 0 0 rgba(201,161,92,.5); }
  70%{ box-shadow:0 0 0 9px rgba(201,161,92,0); }
  100%{ box-shadow:0 0 0 0 rgba(201,161,92,0); }
}
@media (prefers-reduced-motion: reduce){ .ai-dot{ animation:none; } }

.ai-title{
  font-size: clamp(24px,3vw,36px);
  font-weight:700; line-height:1.2; letter-spacing:.01em;
  margin:0 0 16px; max-width:18ch;
}
.ai-lede{
  font-size:14px; font-weight:300; line-height:1.75;
  color:var(--cream-dim); margin:0 0 26px; max-width:52ch;
}

.ai-points{ list-style:none; margin:0 0 30px; padding:0; display:grid; gap:16px; }
.ai-points li{
  position:relative; padding-left:22px;
  font-size:13.5px; font-weight:300; line-height:1.65; color:var(--cream-dim);
}
.ai-points li::before{
  content:''; position:absolute; left:0; top:9px;
  width:9px; height:1px; background:var(--gold);
}
.ai-points strong{ display:block; color:var(--cream); font-weight:500; margin-bottom:2px; }

.ai-cta{
  display:inline-flex; align-items:center; gap:10px;
  font-size:11px; letter-spacing:.2em; font-weight:600;
  color:var(--cream); border-bottom:1px solid var(--line);
  padding-bottom:8px; transition:color .4s var(--ease), border-color .4s var(--ease);
}
.ai-cta:hover{ color:var(--gold); border-color:var(--gold); }
.ai-cta svg{ width:14px; height:14px; transition:transform .4s var(--ease); }
.ai-cta:hover svg{ transform:translateX(5px); }


@media (max-width:560px){
  .ai-cta{ letter-spacing:.12em; font-size:11px; }
  .ai-row{ grid-template-columns: 1fr 84px; gap:12px; }
}


/* ---------- AI som ringer ut (rad 2) ---------- */
.ai-band + .ai-band{ margin-top:18px; }
.ai-band-out{
  grid-template-columns: .95fr 1.05fr;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(201,161,92,.09), rgba(201,161,92,0) 58%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
}
@media (max-width:900px){
  .ai-band-out{ grid-template-columns:1fr; }
  .ai-band-out .ai-panel{ order:2; }
  .ai-band-out .ai-copy{ order:1; }
}
.ai-badges{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 30px; }
.ai-badges span{
  font-size:10px; letter-spacing:.14em; font-weight:600; text-transform:uppercase;
  color:var(--gold); border:1px solid rgba(201,161,92,.36); border-radius:2px;
  padding:6px 10px; white-space:nowrap;
}
.ai-livedot{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--gold); margin:0 6px 1px 2px; animation: aiPuls 2.6s var(--ease) infinite; }
@media (prefers-reduced-motion: reduce){ .ai-livedot{ animation:none; } }
.ai-booked{ text-align:right; line-height:1; }
.ai-booked b{ display:block; font-size:22px; font-weight:700; color:var(--cream); font-variant-numeric:tabular-nums; }
.ai-booked em{ display:block; font-style:normal; font-size:10px; letter-spacing:.14em; color:var(--gold); margin-top:7px; text-transform:uppercase; }
.ai-lock{
  display:flex; align-items:center; gap:8px;
  font-size:10px; letter-spacing:.12em; text-transform:uppercase; font-weight:600;
  color:var(--cream-faint); margin:0 0 14px;
}
.ai-lock svg{ width:12px; height:12px; color:var(--gold); }
.ai-gate{ display:grid; gap:9px; padding-top:16px; border-top:1px solid var(--line); }
.ai-gate-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:4px; }
.ai-gate-v{ font-size:10px; letter-spacing:.08em; color:var(--cream-faint); font-variant-numeric:tabular-nums; }
.ai-check{ display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:12.5px; font-weight:300; color:var(--cream-dim); }
.ai-check b{ color:var(--gold); font-weight:700; font-size:13px; }
.ai-sms{
  margin-top:18px; padding:12px 14px;
  background:rgba(201,161,92,.07); border:1px solid rgba(201,161,92,.28); border-radius:2px;
}
.ai-sms p{ font-size:12.5px; font-weight:300; line-height:1.55; color:var(--cream); margin:0; }
@media (max-width:560px){
  .ai-badges span{ letter-spacing:.08em; font-size:9.5px; white-space:normal; }
}

/* ---------- AI-kortet i hubben ---------- */
.choice-ai{ border-color: rgba(201,161,92,.36); }
.choice-ai .choice-index{ display:flex; align-items:flex-start; gap:9px; }
.choice-ai .choice-index .ai-dot{ flex:none; margin-top:5px; }
.choice-index{ line-height:1.45; }
@media (max-width:1280px) and (min-width:561px){ .choice-index{ min-height:2.9em; } }


/* ---------- AI-panelet, bygget over samme anatomi som Future Ready ---------- */
.ai-panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:2px;
  padding: clamp(20px,2.4vw,28px);
  box-shadow: 0 30px 80px -40px rgba(0,0,0,.6);
}
.ai-panel-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  padding-bottom:16px; margin-bottom:18px; border-bottom:1px solid var(--line);
}
.ai-head-left{ display:grid; gap:5px; }
.ai-tag{ font-size:11px; letter-spacing:.18em; font-weight:600; color:var(--gold); }
.ai-meta{ font-size:11px; letter-spacing:.05em; color:var(--cream-faint); font-variant-numeric:tabular-nums; }
.ai-score{ text-align:right; line-height:1; }
.ai-score b{ font-size:30px; font-weight:700; color:var(--cream); letter-spacing:.01em; }
.ai-score span{ font-size:13px; color:var(--cream-faint); font-weight:300; }
.ai-score em{ display:block; font-style:normal; font-size:10px; letter-spacing:.14em; color:var(--gold); margin-top:7px; }

.ai-chat{ display:grid; gap:10px; margin-bottom:20px; }
.ai-msg{
  max-width:88%;
  background:rgba(246,241,231,.05);
  border:1px solid rgba(246,241,231,.08);
  border-radius:2px;
  padding:10px 13px;
}
.ai-msg.is-agent{ justify-self:end; background:rgba(246,241,231,.09); }
.ai-who{ display:block; font-size:9.5px; letter-spacing:.16em; font-weight:600; color:var(--cream-faint); margin-bottom:5px; text-transform:uppercase; }
.ai-msg p{ font-size:12.5px; font-weight:300; line-height:1.55; color:var(--cream); margin:0; }
.ai-flag{
  display:flex; align-items:center; gap:9px;
  font-size:11px; font-weight:500; letter-spacing:.03em; color:var(--gold);
  border:1px dashed rgba(201,161,92,.45);
  border-radius:2px; padding:8px 12px;
}
.ai-flag i{ flex:none; width:6px; height:6px; border-radius:50%; background:var(--gold); }

.ai-rows{ display:grid; gap:13px; }
.ai-row{ display:grid; grid-template-columns: 1fr 96px 30px; align-items:center; gap:14px; }
.ai-row span:first-child{ font-size:12.5px; font-weight:300; color:var(--cream-dim); }
.ai-bar{ height:3px; background:rgba(246,241,231,.10); border-radius:2px; overflow:hidden; }
.ai-bar i{ display:block; height:100%; background:var(--cream); border-radius:2px; }
.ai-val{ font-size:11.5px; text-align:right; color:var(--cream-faint); font-variant-numeric:tabular-nums; }
.ai-row.is-low span:first-child{ color:var(--cream); font-weight:500; }
.ai-row.is-low .ai-bar i{ background:var(--gold); }
.ai-row.is-low .ai-val{ color:var(--gold); font-weight:600; }

.ai-next{
  display:grid; grid-template-columns: 1.25fr 1fr; gap:18px; align-items:start;
  margin-top:22px; padding-top:18px; border-top:1px solid var(--line);
}
.ai-next-label{ font-size:11px; letter-spacing:.18em; font-weight:600; color:var(--gold); }
.ai-next p{ font-size:12.5px; font-weight:300; line-height:1.6; color:var(--cream-dim); margin:7px 0 0; }
.ai-next strong{ color:var(--gold); font-weight:500; }
.ai-gain{
  background:rgba(201,161,92,.07);
  border:1px solid rgba(201,161,92,.28);
  border-radius:2px; padding:11px 13px;
  display:grid; gap:7px;
}
.ai-gain > span:first-child{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--cream-faint); }
.ai-gain-nums{
  display:inline-flex; align-items:center; gap:8px;
  font-size:15px; color:var(--cream-dim); font-variant-numeric:tabular-nums;
}
.ai-gain-nums svg{ width:14px; height:14px; color:var(--gold); }
.ai-gain-nums b{ color:var(--cream); font-size:19px; font-weight:700; }
.ai-note{ font-size:10px; letter-spacing:.08em; color:var(--cream-faint); margin:16px 0 0; }

@media (max-width:560px){
  .ai-next{ grid-template-columns:1fr; }
  .ai-row{ grid-template-columns: 1fr 74px 28px; gap:10px; }
}

/* ---------- panelet våkner når det kommer i syne ---------- */
.ai-armed .ai-bar i{ transform:scaleX(0); transform-origin:left; }
.ai-armed .ai-fx{ opacity:0; transform:translateY(8px); }
.ai-live .ai-fx{
  opacity:1; transform:none;
  transition: opacity .55s var(--ease), transform .55s var(--ease);
  transition-delay: var(--d, 0s);
}
.ai-live .ai-bar i{
  transform:scaleX(1);
  transition: transform .9s var(--ease);
  transition-delay: calc(var(--d, 0s) + .15s);
}
@media (prefers-reduced-motion: reduce){
  .ai-armed .ai-bar i,
  .ai-armed .ai-fx{ transform:none; opacity:1; transition:none; }
}
