@font-face{
  font-family:"Phonk Sans";
  src:url('assets/fonts/phonk-sans-light.otf') format('opentype');
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Montserrat";
  src:url('assets/fonts/montserrat-regular.ttf') format('truetype');
  font-weight:400;font-style:normal;font-display:swap;
}

:root{
  --bg-light:#E7F0F2;
  --bg-grey-blue:#8AA3B2;
  --bg-grey-blue-deep:#607E96;
  --bg-grey-blue-light:#C0D1DD;
  --bg-dark:#243650;
  --text-dark:#243650;
  --text-white:#FFFFFF;
  --accent:#A8C900;
  --accent-glow:-4px 10px 30px 2px #A8C900;

  --font-display:"Phonk Sans","Montserrat",system-ui,sans-serif;
  --font-body:"Montserrat",system-ui,sans-serif;

  --design-w:2560;
}

/* Fluid scale: 1rem = (100vw / 256). At viewport 2560 → 1rem=10px → all Figma px / 10 = rem. */
html{font-size:clamp(5px, calc(100vw / 256), 16px)}

*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg-light);color:var(--text-dark);font-family:var(--font-body);font-weight:400;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:400}
h3{font-family:var(--font-body)}

/* ---------------- LAYOUT ---------------- */
.page{width:100%;overflow-x:hidden}
.section{position:relative;width:100%}
.container{width:118rem;margin:0 auto;position:relative} /* 1180px @ 2560 */

/* ---------------- HEADER ---------------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:12.3rem;
  pointer-events:none;
}
.site-header > *{pointer-events:auto}
.hdr-bar{
  position:absolute;left:0;right:0;
  height:8rem;
  background:var(--bg-grey-blue);
}
.hdr-wave{
  position:absolute;left:50%;top:0;
  width:83.5rem;height:12.3rem;
  transform:translateX(-50%);
  display:block;
}
.hdr-menu{
  position:absolute;left:44.8rem;top:4.8rem;
  width:2.7rem;height:.7rem;
  padding:0;border:0;background:none;cursor:pointer;
}
.hdr-menu img{width:100%;height:100%;display:block}
.hdr-logo{
  position:absolute;left:50%;top:3.174rem;
  transform:translateX(-50%);
  width:12.2rem;height:8.2rem;
  display:block;
}
.hdr-logo img{width:100%;height:100%;object-fit:contain}
.hdr-cta{
  position:absolute;right:44.7rem;top:3.3rem;
  display:inline-flex;align-items:center;gap:1.1rem;
  padding:1.4rem 2rem 1.4rem 2rem;
  background:var(--accent);color:var(--text-dark);
  border-radius:3.5rem;
  font-family:var(--font-display);font-weight:400;
  font-size:1.3rem;letter-spacing:.13rem;text-transform:lowercase;
  white-space:nowrap;
}
.hdr-cta-dot{
  width:.7rem;height:.7rem;border-radius:50%;background:var(--text-dark);
}

/* ---------------- HERO ---------------- */
.hero{
  position:relative;
  width:100%;height:111rem;
  background:linear-gradient(180deg,#8AA3B2 22.15%,#607E96 87.77%);
  color:var(--text-white);
  overflow:hidden;
}
.hero-photo{
  position:absolute;left:0;right:0;top:5.125rem;
  width:100%;height:104rem;
  border-radius:2.2rem;overflow:hidden;
}
.hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hero-title{
  position:absolute;left:51.8rem;top:25rem;
  width:83.4rem;
  font-family:var(--font-display);font-weight:400;
  font-size:6rem;line-height:6.5rem;letter-spacing:0;
  color:var(--text-white);
  text-shadow:0 0 3rem rgba(0,0,0,.2);
}
.hero-actions{
  position:absolute;left:51.8rem;top:67rem;
  display:flex;align-items:center;gap:.9rem;
}
.btn-main{
  display:inline-flex;align-items:center;justify-content:center;
  width:30rem;height:5rem;
  background:var(--accent);color:var(--text-dark);
  border-radius:10rem;
  font-family:var(--font-display);font-weight:400;
  font-size:1.6rem;letter-spacing:.08rem;
  box-shadow:-.4rem 1rem 3rem .2rem var(--accent);
  white-space:nowrap;
}
.btn-arrow-outline{
  display:inline-flex;align-items:center;justify-content:center;
  width:8.3rem;height:5rem;
  border:.3rem solid var(--accent);
  border-radius:3.5rem;
  color:var(--accent);
  font-size:2.4rem;background:transparent;
}
.hero-card{
  position:absolute;left:187rem;top:12.1rem;
  width:24.7rem;
  padding:3rem;
  background:var(--bg-grey-blue-deep);
  color:var(--text-white);
  border-radius:3rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.5rem;line-height:2rem;letter-spacing:.075rem;
  text-align:center;
}
.hero-glass-arrow{
  position:absolute;left:203.4rem;top:33rem;
  display:inline-flex;align-items:center;justify-content:center;
  width:8.3rem;height:5rem;
  background:rgba(192,209,221,.5);
  border:0;border-radius:3.5rem;
  color:var(--text-dark);
  font-size:2.4rem;
}
.hero-download{
  position:absolute;left:164.8rem;top:100rem;
}
.btn-transparent{
  display:inline-flex;align-items:center;justify-content:center;
  height:5rem;padding:0 3.5rem;
  border:.2rem solid var(--text-white);
  border-radius:3rem;background:transparent;
  color:var(--text-white);
  font-family:var(--font-display);font-weight:400;
  font-size:1.4rem;letter-spacing:.08rem;
  white-space:nowrap;
}
.hero-download-arrow{
  position:absolute;left:200.7rem;top:100rem;
  width:8.3rem;height:5rem;
  display:flex;align-items:center;justify-content:center;
}
.hero-download-arrow img{width:100%;height:100%;display:block}

/* ---------------- ABOUT ---------------- */
.about{
  position:relative;
  width:100%;height:108.5rem;
  background:#607E96 radial-gradient(ellipse 55% 35% at 50% 50%,#8AA3B2 0%,#648293 80%);
  color:var(--text-white);
}
.about-inner{
  position:absolute;left:50%;top:0;
  width:118rem;height:100%;
  transform:translateX(-50%);
}
.about-head{
  position:absolute;left:0;top:9.8rem;
  display:flex;align-items:center;gap:1rem;
}
.about-title{
  font-family:var(--font-display);font-weight:400;
  font-size:4.8rem;line-height:5.8rem;color:var(--text-white);
}
.about-pill{
  display:inline-flex;align-items:center;justify-content:center;
  height:3.8rem;padding:0 2rem;
  background:var(--accent);color:var(--text-white);
  border-radius:3.5rem;
  font-family:var(--font-display);font-weight:400;
  font-size:2.4rem;letter-spacing:.24rem;text-transform:uppercase;
  box-shadow:-.4rem 1rem 3rem .2rem var(--accent);
}
.about-lead{
  position:absolute;left:0;top:21.2rem;
  width:93.4rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-white);
}
.about-grid{
  position:absolute;left:0;top:42.2rem;
  display:flex;gap:2rem;
}
.step-card{
  position:relative;
  width:38rem;height:57rem;
  border:1px solid #E6E6E6;border-radius:4rem;overflow:hidden;
  color:var(--text-white);
}
.step-card .step-img{
  position:absolute;left:0;right:0;top:0;
  height:50.53%;
  background-image:var(--bg-img);
  background-size:cover;background-position:center bottom;
  overflow:hidden;
}
.step-card .step-img::after{
  content:"";
  position:absolute;inset:0;
  background-image:var(--bg-img);
  background-size:cover;background-position:center bottom;
  filter:blur(2rem);
  transform:scale(1.1);
  -webkit-mask-image:linear-gradient(to top right, #000 50%, transparent 100%);
  mask-image:linear-gradient(to top right, #000 50%, transparent 100%);
  pointer-events:none;
}
.step-num{
  position:absolute;left:2rem;top:1.9rem;z-index:2;
  display:inline-flex;align-items:center;justify-content:center;
  padding:1rem 3rem;
  border:1px solid var(--text-white);border-radius:3rem;
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;color:var(--text-white);
}
.step-title{
  position:absolute;left:0;right:0;top:18.9rem;z-index:2;
  height:9.6rem;padding:2rem;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;letter-spacing:.056rem;
  color:var(--text-white);text-align:center;
}
.step-body{
  position:absolute;left:0;right:0;top:28.8rem;z-index:2;
  padding:4rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-white);
}

/* ---------------- PSYCHOLOGISTS ---------------- */
.psy{
  position:relative;width:100%;height:160.7rem;
  background:var(--bg-grey-blue-light);
  color:var(--text-dark);
}
.psy-inner{
  position:absolute;left:50%;top:0;
  width:118rem;height:100%;
  transform:translateX(-50%);
}
.psy-title{
  position:absolute;left:50%;top:9.9rem;
  transform:translateX(-50%);
  width:117.9rem;
  font-family:var(--font-display);font-weight:400;
  font-size:4.8rem;line-height:5.8rem;
  color:var(--text-dark);text-align:center;
}
.psy-lead{
  position:absolute;left:50%;top:52.7rem;
  transform:translateX(-50%);
  width:80.9rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-dark);text-align:center;
}
.psy-tags{
  position:absolute;left:50%;top:27.2rem;
  transform:translateX(-50%);
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:1.4rem 1rem;
  width:120rem;max-width:120rem;
}
.tag{
  display:inline-flex;align-items:center;justify-content:center;
  padding:1rem 4.5rem 1.2rem;
  border:1px solid var(--bg-grey-blue-deep);
  border-radius:5rem;background:transparent;
  font-family:var(--font-display);font-weight:400;
  font-size:1.5rem;line-height:1;letter-spacing:.15rem;
  color:var(--text-dark);
  white-space:nowrap;
  cursor:pointer;
  transition:background-color .15s, border-color .15s, transform .1s;
}
.tag:hover{border-color:var(--accent)}
.tag:active{transform:scale(.96)}
.tag--on{
  background:var(--accent);border-color:var(--accent);color:var(--text-dark);
}
.tag--on:hover{border-color:var(--accent);filter:brightness(.95)}
.psy-grid{
  position:absolute;left:0;top:64.5rem;
  display:flex;gap:2rem;width:100%;
}
.psy-card{
  position:relative;
  width:38rem;height:76.2rem;
  border:1px solid #A5A9B0;border-radius:5rem;
  background:#FFFFFF;color:var(--text-dark);
  box-shadow:0 .8rem 3rem rgba(36,54,80,.06);
}
.psy-avatar{
  position:absolute;left:50%;top:1rem;
  transform:translateX(-50%);
  width:27.7rem;height:27.7rem;
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(192,209,221,0) 32%, rgba(192,209,221,.35) 55%, rgba(192,209,221,.08) 100%);
}
.psy-avatar::before{
  content:"";
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:17.3rem;height:17.3rem;
  border-radius:50%;
  background:#FFFFFF;
  box-shadow:0 0 1.5rem rgba(165,169,176,.2);
}
.psy-avatar::after{
  content:"";
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:14rem;height:14rem;
  border-radius:50%;
  background-image:var(--bg-img);
  background-size:cover;background-position:center;
}
.psy-name{
  position:absolute;left:3rem;right:2.6rem;top:29.3rem;
  font-family:var(--font-display);font-weight:400;
  font-size:2.4rem;line-height:2.8rem;letter-spacing:.048rem;
  color:var(--text-dark);
}
.psy-spec{
  position:absolute;left:2.8rem;right:3.3rem;top:38.2rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.2rem;line-height:1.6rem;letter-spacing:.06rem;
  color:#71757C;
}
.psy-quote{
  position:absolute;left:3rem;right:2.9rem;top:43.3rem;
  font-family:var(--font-body);font-weight:400;font-style:italic;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-dark);
}
.psy-cta{
  position:absolute;right:0;top:145.7rem;
  display:flex;align-items:center;gap:1.7rem;
}
.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  width:30rem;height:5rem;
  background:var(--bg-grey-blue-deep);color:var(--text-white);
  border-radius:10rem;
  font-family:var(--font-display);font-weight:400;
  font-size:1.6rem;letter-spacing:.08rem;
}
.btn-arrow-filled{
  display:inline-flex;align-items:center;justify-content:center;
  width:8.3rem;height:5rem;
  background:var(--accent);color:var(--bg-grey-blue-deep);
  border-radius:3rem;
  font-size:2.4rem;
  filter:drop-shadow(-.4rem 1rem 1.5rem var(--accent));
}

/* ---------------- DEVELOPMENT + PARTNERS ---------------- */
.dev{
  position:relative;width:100%;height:178.3rem;
  background:#5C7C92 radial-gradient(ellipse 60% 45% at 50% 50%,#658399 0%,#537289 100%);
  color:var(--text-white);
}
.dev-inner{
  position:absolute;left:50%;top:0;
  width:118rem;
  transform:translateX(-50%);
}
.dev-title{
  position:absolute;left:50%;top:10rem;
  transform:translateX(-50%);
  width:103.7rem;
  font-family:var(--font-display);font-weight:400;
  font-size:4.8rem;line-height:5.8rem;
  color:var(--text-white);text-align:center;
}
.dev-lead{
  position:absolute;left:50%;top:27.1rem;
  transform:translateX(-50%);
  width:85.9rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-white);text-align:center;
}
.dev-grid{
  position:absolute;left:0;top:50.3rem;
  display:flex;gap:1.2rem;width:100%;
}
.dev-card{
  position:relative;
  width:38.8rem;height:81.6rem;
  border:1px solid #A5A9B0;border-radius:4rem;overflow:hidden;
  color:var(--text-white);
}
.dev-card .dev-img{
  position:absolute;left:0;right:0;top:0;
  height:60.42%;
  background-image:var(--bg-img);
  background-size:cover;background-position:center;
  overflow:hidden;
}
.dev-card .dev-img::after{
  content:"";
  position:absolute;inset:0;
  background-image:var(--bg-img);
  background-size:cover;background-position:center;
  filter:blur(2rem);
  transform:scale(1.2);
  -webkit-mask-image:linear-gradient(to top right, #000 50%, transparent 100%);
  mask-image:linear-gradient(to top right, #000 50%, transparent 100%);
  pointer-events:none;
}
.dev-card-title{
  position:absolute;left:7.74%;right:9.79%;top:44.85%;
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;letter-spacing:.056rem;
  color:var(--text-white);
}
.dev-card-body{
  position:absolute;left:3rem;right:3.8rem;top:52.6rem;
  width:32rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-white);
}
.dev-cta{
  position:absolute;left:50%;top:137.2rem;
  transform:translateX(-50%);
  display:flex;align-items:center;gap:1rem;
}
.btn-main--narrow{width:26rem}

/* PARTNERS strip */
.partners{
  position:absolute;left:0;top:156.3rem;
  width:100%;height:22rem;
  background:var(--bg-grey-blue-light);
  overflow:hidden;
  display:flex;align-items:center;
}
.partners-track{
  display:flex;width:max-content;
  animation:partners-scroll 40s linear infinite reverse;
}
.partners-row{
  display:flex;align-items:center;gap:12rem;
  padding-right:12rem;flex:0 0 auto;
}
.partner-logo{
  height:5rem;display:inline-flex;align-items:center;
  opacity:.85;flex:0 0 auto;
}
.partner-logo img{height:100%;width:auto;display:block}
@keyframes partners-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){.partners-track{animation:none}}

/* ---------------- PRICES ---------------- */
.prices{
  position:relative;width:100%;height:126.2rem;
  background:#537289 radial-gradient(ellipse 50% 50% at 50% 50%,#537289 18%,#658399 87%);
  color:var(--text-white);
}
.prices-inner{
  position:absolute;left:50%;top:0;
  width:118rem;height:100%;
  transform:translateX(-50%);
}
.prices-title{
  position:absolute;left:0;top:12.2rem;
  width:86.1rem;
  font-family:var(--font-display);font-weight:400;
  font-size:4.8rem;line-height:5.8rem;
  color:var(--text-white);
}
.prices-lead{
  position:absolute;left:0;top:23.9rem;
  width:97.3rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
  color:var(--text-white);
}
.prices-grid{
  position:absolute;left:0;top:40rem;
  display:flex;gap:2rem;align-items:start;
}
.price-card{
  position:relative;
  width:38rem;
  display:flex;flex-direction:column;
  padding:6rem 3rem 3rem;
  border:1px solid #A2BECE;border-radius:3rem;
  background:transparent;color:var(--text-white);
}
.price-card--1{min-height:56rem}
.price-card--2{min-height:60rem}
.price-card--3{min-height:64rem}
.price-dots{
  position:absolute;left:3rem;top:2.5rem;
  display:flex;gap:.8rem;
}
.price-dot{width:1.2rem;height:1.2rem;border-radius:50%;background:var(--accent)}
.price-title{
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;letter-spacing:.056rem;
  margin-bottom:1rem;
}
.price-sub{
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
}
.price-hr{
  border:0;height:1px;background:rgba(255,255,255,.3);
  margin:.9rem 0;width:100%;
}
.price-desc{
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
}
.price-term{
  font-family:var(--font-body);font-weight:400;
  font-size:1.8rem;line-height:2.4rem;letter-spacing:.036rem;
}
.price-cost{
  font-family:var(--font-display);font-weight:400;
  font-size:2.4rem;letter-spacing:.048rem;
  text-align:right;margin-top:auto;margin-bottom:2rem;
}
.price-actions{
  display:flex;justify-content:flex-end;gap:1rem;
}
.btn-go-buy{
  display:inline-flex;align-items:center;justify-content:center;
  width:6.1rem;height:4rem;
  border:1px solid var(--text-white);
  border-radius:3.5rem;background:transparent;
  color:var(--text-white);font-size:2rem;cursor:pointer;
}
.btn-buy{
  display:inline-flex;align-items:center;justify-content:center;
  height:4rem;padding:0 2.5rem;
  background:var(--accent);color:var(--text-dark);
  border-radius:3rem;border:0;cursor:pointer;
  font-family:var(--font-display);font-weight:400;
  font-size:1.6rem;letter-spacing:.08rem;
  min-width:21.1rem;
}
.prices-extra{
  position:absolute;left:0;top:101rem;
  width:100%;height:14rem;
  z-index:2;
}
.btn-terms{
  position:absolute;left:0;top:0;
  display:inline-flex;align-items:center;justify-content:center;
  height:4rem;padding:20px;
  border:.2rem solid var(--text-white);
  border-radius:3rem;background:transparent;
  color:var(--text-white);
  font-family:var(--font-display);font-weight:400;
  font-size:1.4rem;letter-spacing:.07rem;
  white-space:nowrap;
}
.btn-gifts{position:absolute;left:0;top:8rem}
.prices-extra .btn-gift{position:absolute;left:42.9rem;top:8rem}
.btn-gift{
  display:inline-flex;align-items:center;justify-content:center;
  width:8.2rem;height:5rem;padding:0;
  border:.3rem solid var(--accent);border-radius:3.5rem;
  background:transparent;cursor:pointer;
}
.btn-gift img{
  width:2.4rem;height:2.4rem;
  filter:invert(72%) sepia(95%) saturate(456%) hue-rotate(34deg) brightness(92%) contrast(98%);
}

/* ---------------- AUTH ---------------- */
.auth{
  position:relative;width:100%;height:95rem;
  overflow:hidden;color:var(--text-white);
}
.auth-bg{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
  z-index:0;
}
.auth-inner{
  position:absolute;left:50%;top:0;
  width:118rem;height:100%;
  transform:translateX(-50%);
  z-index:2;
}
.auth-title{
  position:absolute;left:50%;top:41rem;
  transform:translateX(-50%);
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;letter-spacing:.056rem;
  color:#E7F0F2;
  text-align:center;
  white-space:nowrap;
}
.auth-tabs{
  position:absolute;left:50%;top:47.5rem;
  transform:translateX(-50%);
  display:flex;gap:0;
}
.auth-tab{
  display:inline-flex;align-items:center;justify-content:center;
  width:24.6rem;height:5.7rem;padding:0;
  background:#ADC7D5;color:var(--text-dark);
  border:0;cursor:pointer;
  border-radius:10rem;
  font-family:var(--font-display);font-weight:400;
  font-size:1.6rem;letter-spacing:.08rem;
}
.auth-tab + .auth-tab{margin-left:1.2rem}
.auth-tab.is-active{background:var(--accent);box-shadow:-.4rem 1rem 3rem .2rem var(--accent);z-index:1;position:relative}

.auth-form{
  position:absolute;left:50%;top:44rem;
  transform:translateX(-50%);
  width:50rem;
  display:grid;grid-template-columns:1fr;gap:1.6rem;
  padding:3rem 3.5rem;
  background:rgba(231,240,242,.92);
  border-radius:2.4rem;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 2rem 6rem rgba(36,54,80,.25);
  color:var(--text-dark);
}
.auth-field{display:flex;flex-direction:column;gap:.6rem;font-family:var(--font-body);font-size:1.3rem;letter-spacing:.05rem;color:var(--text-dark)}
.auth-field input{
  height:4.6rem;padding:0 1.6rem;
  background:#fff;border:1px solid #C7D6DE;border-radius:1.2rem;
  font-family:var(--font-body);font-size:1.5rem;color:var(--text-dark);
  outline:none;transition:border-color .15s;
}
.auth-field input:focus{border-color:var(--text-dark)}
.auth-submit{
  margin-top:.6rem;height:4.8rem;
  display:inline-flex;align-items:center;justify-content:center;gap:1.1rem;
  background:var(--accent);color:var(--text-dark);
  border:0;border-radius:3.5rem;cursor:pointer;
  font-family:var(--font-display);font-weight:400;
  font-size:1.4rem;letter-spacing:.13rem;text-transform:lowercase;
}
.auth-submit-dot{width:.7rem;height:.7rem;border-radius:50%;background:var(--text-dark)}
.auth-link{
  justify-self:center;
  font-family:var(--font-body);font-size:1.2rem;color:var(--text-dark);
  text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.1rem;
}
.auth-disclaimer{
  margin:.4rem 0 0;
  font-family:var(--font-body);font-size:1.1rem;line-height:1.6rem;letter-spacing:.04rem;
  color:var(--text-dark);text-align:center;
}
.auth-disclaimer a{color:var(--text-dark)}

/* ---------------- FOOTER ---------------- */
.site-footer{
  position:relative;width:100%;height:55.1rem;
  margin-top:-12rem;
  color:var(--text-dark);
  overflow:hidden;
  z-index:5;
}
.footer-bar{
  position:absolute;left:0;right:0;
  top:6.3rem;bottom:0;
  background:var(--bg-grey-blue);
}
.footer-wave{
  position:absolute;left:50%;top:0;
  width:127.3rem;height:18.7rem;
  transform:translateX(-50%) scaleY(-1);
  display:block;
}
.footer-orb{
  position:absolute;left:50%;top:1.5rem;z-index:2;
  width:12.9rem;height:8.6rem;
  transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;
}
.footer-orb img{width:100%;height:100%;object-fit:contain}

.footer-links{
  position:absolute;left:50%;top:16rem;
  transform:translateX(-50%);
  width:118rem;
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:start;
  font-family:var(--font-body);font-weight:400;
  font-size:1.6rem;line-height:3rem;letter-spacing:.08rem;
  color:var(--text-dark);
}
.footer-col{list-style:none;padding:0;margin:0}
.footer-col--left{text-align:left}
.footer-col--center{text-align:center;min-width:18rem}
.footer-col--right{text-align:right}
.footer-col li{cursor:pointer}
.footer-col li:hover{color:var(--accent)}

.footer-social{
  position:absolute;right:69rem;top:26.3rem;
  display:flex;align-items:center;gap:0.6rem;
}
.footer-social a{
  display:inline-flex;align-items:center;justify-content:center;
  width:2.4rem;height:2.4rem;
}
.footer-social a img{width:100%;height:100%;object-fit:contain}

.footer-disclaimer{
  position:absolute;left:50%;top:33.5rem;
  transform:translateX(-50%);
  width:82.8rem;
  font-family:var(--font-body);font-weight:400;
  font-size:1.2rem;line-height:1.6rem;letter-spacing:.06rem;
  color:var(--text-dark);text-align:center;
}
.footer-copy{
  position:absolute;left:50%;top:43.9rem;
  transform:translateX(-50%);
  font-family:var(--font-body);font-weight:400;
  font-size:1.2rem;line-height:1.6rem;letter-spacing:.06rem;
  color:var(--text-dark);text-align:center;
}

/* ---------------- MENU DRAWER ---------------- */
.menu-backdrop{
  position:fixed;inset:0;z-index:200;
  background:rgba(36,54,80,.5);
  opacity:0;pointer-events:none;
  transition:opacity .25s ease;
}
.menu-backdrop.is-open{opacity:1;pointer-events:auto}

.menu-drawer{
  position:fixed;left:0;top:0;bottom:0;z-index:201;
  width:42rem;max-width:88vw;
  padding:9rem 5rem 4rem;
  background:var(--bg-grey-blue);color:var(--text-dark);
  display:flex;flex-direction:column;gap:2.6rem;
  transform:translateX(-100%);
  transition:transform .3s ease;
  box-shadow:1rem 0 4rem rgba(36,54,80,.25);
}
.menu-drawer.is-open{transform:translateX(0)}
.menu-drawer a{
  font-family:var(--font-display);font-weight:400;
  font-size:2.4rem;letter-spacing:.05rem;color:var(--text-dark);
  text-decoration:none;
  transition:color .15s;
}
.menu-drawer a:hover{color:var(--accent)}
.menu-drawer .menu-cta{
  margin-top:auto;align-self:flex-start;
  display:inline-flex;align-items:center;justify-content:center;
  padding:1.4rem 3rem;
  background:var(--accent);color:var(--text-dark);
  border-radius:3.5rem;
  font-size:1.6rem;letter-spacing:.08rem;text-transform:lowercase;
}
.menu-close{
  position:absolute;right:2rem;top:2rem;
  width:4rem;height:4rem;
  background:transparent;border:0;cursor:pointer;
  font-size:3rem;line-height:1;color:var(--text-dark);
}

/* ---------------- AUTH MODAL ---------------- */
.auth-modal{
  position:fixed;inset:0;z-index:300;
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .2s ease;
}
.auth-modal.is-open{opacity:1;pointer-events:auto}
.auth-modal-backdrop{
  position:absolute;inset:0;
  background:rgba(36,54,80,.6);
  backdrop-filter:blur(.6rem);
  -webkit-backdrop-filter:blur(.6rem);
}
.auth-modal-card{
  position:relative;z-index:1;
  width:54rem;max-width:92vw;
  max-height:90vh;overflow-y:auto;
  padding:5rem 5rem 4rem;
  background:#E7F0F2;color:var(--text-dark);
  border-radius:2.4rem;
  box-shadow:0 3rem 8rem rgba(36,54,80,.35);
  display:flex;flex-direction:column;gap:1.8rem;
  transform:scale(.96);
  transition:transform .2s ease;
}
.auth-modal.is-open .auth-modal-card{transform:scale(1)}
.auth-modal-close{
  position:absolute;right:1.6rem;top:1.4rem;
  width:4rem;height:4rem;
  background:transparent;border:0;cursor:pointer;
  font-size:3rem;line-height:1;color:var(--text-dark);
}
.auth-modal-title{
  font-family:var(--font-display);font-weight:400;
  font-size:2.8rem;line-height:2.8rem;letter-spacing:.056rem;
  color:var(--text-dark);text-align:center;margin:0 0 .4rem;
}
.auth-modal-tabs{
  display:flex;gap:1.2rem;justify-content:center;
  margin-bottom:.6rem;
}
.auth-modal-tab{
  display:inline-flex;align-items:center;justify-content:center;
  height:4.4rem;padding:0 2.8rem;
  background:#ADC7D5;color:var(--text-dark);
  border:0;cursor:pointer;border-radius:10rem;
  font-family:var(--font-display);font-weight:400;
  font-size:1.4rem;letter-spacing:.07rem;
  transition:background-color .15s, box-shadow .15s;
}
.auth-modal-tab.is-active{
  background:var(--accent);
  box-shadow:-.4rem 1rem 3rem .2rem rgba(168,201,0,.4);
}
.auth-modal-form{
  display:flex;flex-direction:column;gap:1.4rem;
}
.auth-modal-form[hidden]{display:none}

.auth-error{
  margin:0;padding:.8rem 1.2rem;
  background:rgba(220,53,69,.1);
  border:1px solid rgba(220,53,69,.3);
  border-radius:.8rem;
  color:#A82A3A;font-size:1.2rem;line-height:1.5;
}

/* ================================================================
   RESPONSIVE — main site (index.html)
   Design is 2560px wide with absolute positioning at fluid rem.
   Below 1024px viewport, rem clamps to 5px → absolute coords break.
   Override to natural flow + stacked layouts.
   ================================================================ */

@media (max-width: 1024px){
  /* ===== HEADER ===== */
  .site-header{ height:6rem; }
  .hdr-wave{ display:none; }
  .hdr-bar{ height:6rem; top:0; }
  .hdr-menu{ left:2.4rem; top:2.65rem; }
  .hdr-logo{ width:8rem; height:5rem; top:.5rem; }
  .hdr-cta{
    right:2rem; top:1.3rem;
    padding:1rem 1.6rem; font-size:1.2rem;
  }

  /* ===== HERO ===== */
  .hero{ height:auto; min-height:60rem; padding:7rem 2.4rem 4rem; }
  .hero-photo{
    position:absolute; left:0; right:0; top:6rem;
    width:100%; height:100%;
    border-radius:0;
    opacity:.55;
    z-index:0;
  }
  .hero-photo img{ object-position:center; }
  .hero-title{
    position:relative; left:0; top:0;
    width:100%;
    font-size:3.4rem; line-height:3.8rem;
    z-index:1;
    margin-bottom:3rem;
  }
  .hero-actions{
    position:relative; left:0; top:0;
    flex-wrap:wrap; gap:1rem;
    z-index:1;
  }
  .btn-main{ width:auto; min-width:24rem; height:4.6rem; font-size:1.4rem; }
  .btn-arrow-outline{ width:7rem; height:4.6rem; font-size:2rem; }
  .hero-card{
    position:relative; left:0; top:0;
    width:100%; max-width:36rem; margin-top:3rem;
    padding:2rem; font-size:1.3rem; line-height:1.8rem;
    z-index:1;
  }
  .hero-glass-arrow{ display:none; }
  .hero-download{
    position:relative; left:0; top:0;
    display:inline-flex; margin-top:3rem;
    height:4.6rem; padding:0 2.4rem;
  }
  .hero-download-arrow{
    position:relative; left:0; top:0;
    display:inline-flex; margin-top:1rem;
    width:7rem; height:4.6rem;
  }

  /* ===== ABOUT ===== */
  .about{ height:auto; padding:6rem 0 6rem; }
  .about-inner{ position:relative; left:0; top:0; transform:none; width:100%; padding:0 2.4rem; }
  .about-head{ position:relative; left:0; top:0; flex-wrap:wrap; }
  .about-title{ font-size:3rem; line-height:3.6rem; }
  .about-pill{ font-size:1.6rem; height:3rem; padding:0 1.6rem; }
  .about-lead{ position:relative; left:0; top:0; width:100%; margin:2rem 0 3rem; font-size:1.4rem; line-height:2rem; }
  .about-grid{
    position:relative; left:0; top:0;
    flex-direction:column; gap:2rem;
  }
  .step-card{ width:100%; max-width:42rem; height:auto; min-height:42rem; margin:0 auto; }

  /* ===== PSY (psychologists) ===== */
  .psy{ height:auto; padding:6rem 0; }
  .psy-inner{ position:relative; left:0; top:0; transform:none; width:100%; padding:0 2.4rem; height:auto; }
  .psy-title{ position:relative; left:0; top:0; transform:none; width:100%; font-size:2.6rem; line-height:3.2rem; }
  .psy-lead{ position:relative; left:0; top:0; transform:none; width:100%; margin:2rem 0 3rem; font-size:1.4rem; line-height:2rem; }
  .psy-tags{ position:relative; left:0; top:0; transform:none; width:100%; max-width:100%; gap:.8rem; margin-bottom:3rem; }
  .tag{ font-size:1.2rem; padding:.8rem 2rem; }
  .psy-grid{
    position:relative; left:0; top:0;
    flex-direction:column; gap:2rem; width:100%;
  }
  .psy-card{ width:100%; max-width:40rem; height:auto; min-height:48rem; margin:0 auto; padding-bottom:2rem; }
  .psy-name, .psy-spec, .psy-quote{
    position:static; left:auto; right:auto; top:auto;
    padding:0 3rem;
  }
  .psy-name{ margin-top:2rem; font-size:2rem; line-height:2.4rem; }
  .psy-spec{ margin-top:1rem; font-size:1.2rem; }
  .psy-quote{ margin-top:1.6rem; font-size:1.4rem; line-height:1.9rem; }
  .psy-cta{ position:relative; right:0; top:0; margin:3rem auto 0; flex-wrap:wrap; justify-content:center; }
  .btn-secondary{ width:auto; min-width:22rem; height:4.6rem; font-size:1.4rem; }
  .btn-arrow-filled{ width:7rem; height:4.6rem; font-size:2rem; }

  /* ===== DEV + PARTNERS ===== */
  .dev{ height:auto; padding:6rem 0; }
  .dev-inner{ position:relative; left:0; top:0; transform:none; width:100%; padding:0 2.4rem; }
  .dev-title{ position:relative; left:0; top:0; width:100%; font-size:2.6rem; line-height:3.2rem; }
  .dev-lead{ position:relative; left:0; top:0; width:100%; margin:2rem 0 3rem; font-size:1.4rem; line-height:2rem; }
  .dev-grid{
    position:relative; left:0; top:0;
    flex-direction:column; gap:2rem;
  }
  .dev-card{ width:100%; max-width:42rem; height:auto; min-height:42rem; margin:0 auto; }
  .dev-card-title, .dev-card-body{ position:static; left:auto; right:auto; top:auto; padding:0 2.4rem; }
  .dev-card-title{ margin-top:2rem; font-size:1.8rem; }
  .dev-card-body{ margin-top:1rem; font-size:1.3rem; }
  .partners-row, .partners-marquee, .partners-title{
    position:relative; left:0; top:0; transform:none; width:100%; margin-top:3rem;
  }

  /* ===== PRICES ===== */
  .prices{ height:auto; padding:6rem 0; }
  .prices-inner{ position:relative; left:0; top:0; transform:none; width:100%; padding:0 2.4rem; height:auto; }
  .prices-title{ position:relative; left:0; top:0; width:100%; font-size:2.6rem; line-height:3.2rem; }
  .prices-lead{ position:relative; left:0; top:0; width:100%; margin:2rem 0 3rem; font-size:1.4rem; line-height:2rem; }
  .prices-grid{
    position:relative; left:0; top:0;
    flex-direction:column; gap:2rem;
  }
  .price-card{ width:100%; max-width:38rem; min-height:auto; margin:0 auto; padding:5rem 2.4rem 2.4rem; }
  .price-card--1, .price-card--2, .price-card--3{ min-height:auto; }
  .prices-extra{ position:relative; left:0; top:0; width:100%; height:auto; margin-top:3rem; display:flex; flex-direction:column; gap:1.2rem; align-items:flex-start; }
  .btn-terms, .btn-gifts, .prices-extra .btn-gift{ position:relative; left:0; top:0; }

  /* ===== AUTH section ===== */
  .auth{ height:auto; min-height:50rem; padding:6rem 2.4rem; }
  .auth-bg{ opacity:.4; }
  .auth-inner{ position:relative; left:0; top:0; transform:none; width:100%; height:auto; }
  .auth-title{ position:relative; left:0; top:0; transform:none; font-size:2.4rem; margin-bottom:2rem; text-align:center; }
  .auth-tabs{ position:relative; left:0; top:0; transform:none; justify-content:center; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; }
  .auth-tab{ width:auto; min-width:14rem; padding:0 2rem; font-size:1.4rem; height:4.6rem; }
  .auth-form{ position:relative; left:0; top:0; transform:none; width:100%; max-width:42rem; margin:0 auto; padding:2.4rem; }
  .auth-form .auth-field input{ height:4.6rem; font-size:1.4rem; padding:0 1.4rem; }
  .auth-submit{ height:4.6rem; font-size:1.4rem; }

  /* ===== AUTH MODAL ===== */
  .auth-modal-card{ width:calc(100vw - 4rem); max-width:42rem; padding:3rem 2.4rem; gap:1.4rem; }
  .auth-modal-tab{ padding:0 2rem; font-size:1.3rem; height:4rem; }
  .auth-modal-close{ right:1rem; top:.6rem; }

  /* ===== FOOTER ===== */
  .site-footer{ height:auto; padding:6rem 2.4rem 3rem; }
  .footer-bar{ top:4rem; }
  .footer-wave{ width:60rem; height:9rem; }
  .footer-orb{ width:9rem; height:6rem; top:1rem; }
  .footer-links{
    position:relative; left:0; top:0; transform:none; width:100%;
    grid-template-columns:1fr; gap:2rem;
    text-align:center; margin-top:6rem;
  }
  .footer-col--left, .footer-col--right{ text-align:center; }
  .footer-social{
    position:relative; right:0; top:0;
    justify-content:center; margin-top:2rem;
  }
  .footer-disclaimer{
    position:relative; left:0; top:0; transform:none;
    width:100%; margin-top:3rem; font-size:1.1rem;
  }
  .footer-copy{
    position:relative; left:0; top:0; transform:none;
    width:100%; margin-top:1.6rem; font-size:1.1rem;
  }

  /* ===== MENU DRAWER on mobile ===== */
  .menu-drawer{ width:80vw; max-width:36rem; padding:7rem 3rem 3rem; gap:2rem; }
  .menu-drawer a{ font-size:2rem; }
}

/* ===== PHONE: <600px ===== */
@media (max-width: 600px){
  .hero-title{ font-size:2.8rem; line-height:3.2rem; }
  .about-title, .psy-title, .dev-title, .prices-title{ font-size:2.2rem; line-height:2.8rem; }
  .about-lead, .psy-lead, .dev-lead, .prices-lead{ font-size:1.3rem; line-height:1.8rem; }
  .step-card{ min-height:36rem; }
  .price-card{ padding:4rem 2rem 2rem; }
  .price-title{ font-size:2rem; }
  .price-sub, .price-desc, .price-term{ font-size:1.3rem; line-height:1.8rem; }
  .price-cost{ font-size:2rem; }
  .btn-main, .btn-secondary{ min-width:0; width:100%; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .btn-arrow-outline{ display:none; }
  .auth-modal-card{ padding:2.4rem 1.8rem; }
  .auth-modal-tab{ font-size:1.2rem; padding:0 1.6rem; }
  .footer-disclaimer{ font-size:1rem; line-height:1.4rem; }
}