:root{
  color-scheme:light;

  --bg:#f5f7f6;
  --surface:#ffffff;
  --surface-soft:#eef3f1;

  --ink:#123f3d;
  --ink-strong:#082f2d;
  --muted:#78908d;

  --brand:#0f5552;
  --brand-deep:#083d3a;
  --brand-soft:#dceae7;

  --accent:#bb9966;

  --line:rgba(15,85,82,.13);
  --line-strong:rgba(15,85,82,.22);

  --shadow:
    0 18px 55px rgba(18,63,61,.07);

  --max:1180px;
}


html[data-theme="dark"]{
  color-scheme:dark;

  --bg:#071312;
  --surface:#0d1c1a;
  --surface-soft:#112522;

  --ink:#dce9e6;
  --ink-strong:#f7fbfa;
  --muted:#89a39f;

  --brand:#74bbb3;
  --brand-deep:#a5d8d2;
  --brand-soft:#173732;

  --accent:#caaa78;

  --line:rgba(221,238,234,.10);
  --line-strong:rgba(221,238,234,.18);

  --shadow:
    0 24px 65px rgba(0,0,0,.28);
}


*{
  box-sizing:border-box;
}


html{
  scroll-behavior:smooth;
}


body{
  margin:0;
  min-height:100vh;

  background:
    radial-gradient(
      circle at 50% -10%,
      rgba(15,85,82,.055),
      transparent 35%
    ),
    var(--bg);

  color:var(--ink);

  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  -webkit-font-smoothing:antialiased;

  transition:
    background .25s ease,
    color .25s ease;
}


button,
a{
  font:inherit;
}


button{
  color:inherit;
}


a{
  color:inherit;
  text-decoration:none;
}


.site-header{
  width:min(calc(100% - 56px),var(--max));
  min-height:92px;

  margin:0 auto;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:24px;
}


.brand{
  display:flex;
  align-items:center;
  gap:12px;
}


.brand-symbol{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:var(--brand);
  color:#fff;

  font-size:18px;
  font-weight:850;

  letter-spacing:-.04em;
}


.brand-copy{
  display:flex;
  align-items:baseline;
  gap:5px;
}


.brand-copy strong{
  color:var(--ink-strong);

  font-size:20px;
  font-weight:800;

  letter-spacing:-.045em;
}


.brand-copy small{
  color:var(--muted);

  font-size:10px;
  font-weight:800;

  letter-spacing:.14em;
}


.header-tools{
  display:flex;
  align-items:center;
  gap:14px;
}


.language-switch{
  padding:4px;

  display:flex;
  align-items:center;

  border:1px solid var(--line);

  background:var(--surface);

  border-radius:999px;
}


.language{
  min-width:38px;
  height:32px;

  padding:0 10px;

  border:0;
  border-radius:999px;

  background:transparent;
  color:var(--muted);

  font-size:11px;
  font-weight:800;

  cursor:pointer;
}


.language.active{
  background:var(--brand);
  color:#fff;
}


.theme-toggle{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  border:1px solid var(--line);
  border-radius:50%;

  background:var(--surface);
  color:var(--ink);

  cursor:pointer;

  transition:.2s ease;
}


.theme-toggle:hover{
  transform:translateY(-1px);

  border-color:var(--line-strong);
}


.theme-icon{
  font-size:18px;
}


.entry-shell{
  min-height:calc(100vh - 170px);

  display:grid;
  place-items:center;

  padding:58px 24px 80px;
}


.entry{
  width:min(100%,660px);
}


.intro{
  margin-bottom:34px;
}


.eyebrow{
  display:block;

  margin-bottom:12px;

  color:var(--brand);

  font-size:11px;
  font-weight:850;

  letter-spacing:.18em;
}


.intro h1{
  margin:0;

  color:var(--ink-strong);

  font-size:
    clamp(44px,6vw,68px);

  line-height:1;

  font-weight:500;

  letter-spacing:-.055em;
}


.intro p{
  max-width:560px;

  margin:20px 0 0;

  color:var(--muted);

  font-size:15px;
  line-height:1.7;
}


.choices{
  display:grid;
  gap:11px;
}


.choice-card{
  width:100%;

  min-height:91px;

  padding:17px 19px;

  display:grid;
  grid-template-columns:48px 1fr 32px;
  align-items:center;
  gap:15px;

  border:1px solid var(--line);
  border-radius:18px;

  background:var(--surface);

  text-align:left;

  cursor:pointer;

  box-shadow:
    0 1px 0 rgba(255,255,255,.22);

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}


.choice-card:hover{
  transform:translateY(-2px);

  border-color:var(--line-strong);

  box-shadow:var(--shadow);
}


.choice-icon{
  width:44px;
  height:44px;

  display:grid;
  place-items:center;

  border-radius:13px;

  background:var(--surface-soft);
  color:var(--brand);

  font-size:11px;
  font-weight:850;

  letter-spacing:.06em;
}


.choice-content{
  display:block;
}


.choice-content strong{
  display:block;

  color:var(--ink-strong);

  font-size:15px;
  font-weight:650;

  letter-spacing:-.015em;
}


.choice-content small{
  display:block;

  margin-top:5px;

  color:var(--muted);

  font-size:12px;
  line-height:1.45;
}


.choice-arrow{
  color:var(--brand);

  font-size:19px;

  opacity:.67;

  transition:
    transform .18s ease,
    opacity .18s ease;
}


.choice-card:hover .choice-arrow{
  transform:translateX(3px);
  opacity:1;
}


.quick-start{
  padding-top:27px;
}


.or{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:14px;

  margin-bottom:20px;
}


.or span{
  height:1px;
  background:var(--line);
}


.or small{
  color:var(--muted);

  font-size:11px;
}


.talk-button{
  width:100%;
  min-height:58px;

  padding:0 20px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  border:0;
  border-radius:17px;

  background:var(--brand);
  color:#fff;

  font-size:14px;
  font-weight:750;

  cursor:pointer;

  box-shadow:
    0 15px 36px rgba(15,85,82,.17);

  transition:
    transform .18s ease,
    background .18s ease;
}


.talk-button:hover{
  transform:translateY(-2px);

  background:var(--brand-deep);
}


.talk-dot{
  width:8px;
  height:8px;

  border-radius:50%;

  background:#9fd9d0;

  box-shadow:
    0 0 0 5px rgba(255,255,255,.09);
}


.mic{
  margin-left:2px;

  font-size:20px;

  transform:rotate(90deg);
}


.login-copy{
  margin:19px 0 0;

  color:var(--muted);

  text-align:center;

  font-size:11px;
}


.login-copy a{
  margin-left:4px;

  color:var(--brand);

  font-weight:750;

  border-bottom:1px solid var(--line-strong);
}


.footer{
  width:min(calc(100% - 56px),var(--max));

  margin:0 auto;

  min-height:70px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  border-top:1px solid var(--line);

  color:var(--muted);

  font-size:9px;
  font-weight:800;

  letter-spacing:.12em;
}


@media(max-width:680px){

  .site-header{
    width:calc(100% - 30px);
    min-height:74px;
  }


  .entry-shell{
    align-items:start;

    padding:
      48px 15px
      65px;
  }


  .intro{
    margin-bottom:27px;
  }


  .intro h1{
    font-size:44px;
  }


  .intro p{
    margin-top:15px;
  }


  .choice-card{
    min-height:84px;

    padding:14px;

    grid-template-columns:
      43px
      1fr
      24px;

    border-radius:16px;
  }


  .choice-icon{
    width:41px;
    height:41px;
  }


  .footer{
    width:calc(100% - 30px);

    flex-direction:column;
    align-items:flex-start;
    justify-content:center;

    gap:5px;
  }
}

/* UNIRE / UNNA BRAND ALIGNMENT */

:root{
  --bg:#f3f9fd;
  --surface:#ffffff;
  --surface-soft:#eef7fc;

  --ink:#0a2945;
  --ink-strong:#061f38;
  --muted:#607c92;

  --brand:#108fce;
  --brand-deep:#0876bd;
  --brand-soft:#e3f4fc;

  --accent:#12b99d;

  --line:rgba(10,74,116,.13);
  --line-strong:rgba(10,74,116,.24);

  --brand-gradient:
    linear-gradient(
      120deg,
      #138cd0 0%,
      #11a9c1 48%,
      #16be8d 100%
    );

  --shadow:
    0 18px 55px rgba(7,56,91,.09);
}


html[data-theme="dark"]{
  --bg:#061b2c;
  --surface:#0a2942;
  --surface-soft:#0d3552;

  --ink:#dcedf8;
  --ink-strong:#ffffff;
  --muted:#8fb1c7;

  --brand:#26a7df;
  --brand-deep:#148dc7;
  --brand-soft:#103b57;

  --accent:#19c59d;

  --line:rgba(192,226,244,.12);
  --line-strong:rgba(192,226,244,.22);

  --shadow:
    0 24px 65px rgba(0,0,0,.28);
}


body{
  background:
    radial-gradient(
      circle at 78% 12%,
      rgba(21,185,157,.07),
      transparent 28%
    ),
    radial-gradient(
      circle at 18% -8%,
      rgba(17,145,207,.09),
      transparent 31%
    ),
    var(--bg);
}


.brand-symbol{
  background:var(--brand-gradient);
}


.language.active{
  background:var(--brand-gradient);
}


.talk-button{
  background:var(--brand-gradient);
}


.talk-button:hover{
  background:var(--brand-gradient);
  filter:brightness(.96);
}


.choice-icon{
  color:var(--brand-deep);
}


.custom-domain{
  margin-top:27px;
}


.custom-or{
  margin-bottom:16px;
}


.domain-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
}


.domain-form input{
  width:100%;
  min-width:0;
  min-height:58px;

  padding:0 18px;

  border:1px solid var(--line);
  border-radius:17px;

  outline:none;

  background:var(--surface);
  color:var(--ink-strong);

  font-size:14px;

  transition:
    border-color .18s ease,
    box-shadow .18s ease;
}


.domain-form input::placeholder{
  color:var(--muted);
  opacity:.72;
}


.domain-form input:focus{
  border-color:var(--brand);

  box-shadow:
    0 0 0 4px rgba(17,145,207,.10);
}


.domain-submit{
  min-height:58px;

  padding:0 20px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  border:0;
  border-radius:17px;

  background:var(--ink-strong);
  color:white;

  font-weight:750;

  cursor:pointer;
}


@media(max-width:680px){
  .domain-form{
    grid-template-columns:1fr;
  }

  .domain-submit{
    width:100%;
  }
}
