/* ===== front page (portal) ===== */
.section{padding:88px 0;position:relative}
.section--tight{padding:56px 0}
.section--bg{background:linear-gradient(180deg,#f7fafd 0%,#eaf3fb 100%)}
.sec-head{margin-bottom:42px}
.sec-head h2{font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:600;line-height:1.4;margin:.4em 0 .3em}
.sec-head p{color:var(--sub);max-width:46em}
.sec-head--sub{margin-top:56px;margin-bottom:26px}
.sec-head--sub h2{font-size:1.4rem}

/* hero */
@keyframes heroGrad{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes heroIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero{position:relative;color:#f6fbff;overflow:hidden;
  background:linear-gradient(125deg,#163f68 0%,#235f97 38%,#3a86c2 68%,#62b0e0 100%);
  background-size:220% 220%;animation:heroGrad 20s ease infinite}
.hero::before{content:"";position:absolute;top:-25%;right:-8%;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(227,198,132,.32),transparent 62%);animation:floatY 9s ease-in-out infinite}
.hero::after{content:"";position:absolute;bottom:-30%;left:-10%;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.18),transparent 60%)}
.hero__in{position:relative;z-index:2;padding:108px 0 100px}
.hero__in>*{animation:heroIn .9s cubic-bezier(.2,.7,.2,1) both}
.hero__in>:nth-child(2){animation-delay:.1s}
.hero__in>:nth-child(3){animation-delay:.2s}
.hero__in>:nth-child(4){animation-delay:.3s}
.hero__in>:nth-child(5){animation-delay:.42s}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(1.65rem,6vw,3.5rem);line-height:1.45;letter-spacing:.01em;margin-top:.5em;text-shadow:0 2px 24px rgba(11,38,64,.35)}
.hero h1 em{font-family:var(--lat);font-style:italic;
  background:linear-gradient(120deg,#ffe9b8,#f6cf7e);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__lead{margin:28px 0 36px;font-size:1.1rem;max-width:38em;color:#eaf3fb}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap}
.hero__stats{display:flex;gap:44px;margin-top:56px;flex-wrap:wrap}
.hero__stats div b{font-family:var(--lat);font-size:2.3rem;display:block;line-height:1;
  background:linear-gradient(120deg,#ffe9b8,#f3c873);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__stats div span{font-size:.82rem;color:#d7e8f6;letter-spacing:.06em}

/* values */
.values{display:grid;grid-template-columns:repeat(3,1fr);border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.values>div{padding:34px 28px;border-right:1px solid var(--line);position:relative;transition:transform .3s,background .3s}
.values>div::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold);transform:scaleX(0);transform-origin:left;transition:transform .4s}
.values>div:hover{transform:translateY(-4px);background:linear-gradient(180deg,#fff,#f6fafe)}
.values>div:hover::before{transform:scaleX(1)}
.values>div:last-child{border-right:0}
.values .k{font-family:var(--lat);letter-spacing:.18em;font-size:.8rem;font-weight:600;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.values h3{font-family:var(--serif);font-size:1.2rem;margin:.5em 0 .35em;font-weight:600}
.values p{font-size:.92rem;color:var(--sub)}
@media(max-width:740px){.values{grid-template-columns:1fr}.values>div{border-right:0;border-bottom:1px solid var(--line)}}

/* picks */
.grid--picks{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;grid-auto-rows:1fr}
.card--big{grid-row:span 2}
.card--big .card__img{aspect-ratio:1.7/1}
.card--big .card__title{font-size:1.35rem}
@media(max-width:980px){.grid--picks{grid-template-columns:1fr 1fr}.card--big{grid-row:auto;grid-column:1/-1}}
@media(max-width:560px){.grid--picks{grid-template-columns:1fr}}

/* series */
.series-wrap{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.series{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 28px 16px;position:relative;overflow:hidden;
  transition:transform .3s,box-shadow .3s}
.series::before{content:"";position:absolute;left:0;top:0;width:4px;height:100%;background:var(--grad-deep);opacity:.85}
.series:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.series__name{font-family:var(--serif);font-size:1.18rem;font-weight:600}
.series__desc{color:var(--sub);font-size:.9rem;margin:.4em 0 1.1em}
.vol{display:flex;gap:14px;align-items:baseline;padding:11px 0;border-top:1px dashed var(--line);transition:padding-left .25s}
.vol:hover{padding-left:6px}
.vol:hover .vol__t{color:var(--navy)}
.vol__no{font-family:var(--lat);font-size:.88rem;min-width:46px;letter-spacing:.04em;font-weight:600;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.vol__t{font-size:.93rem;line-height:1.55;transition:color .2s}
@media(max-width:820px){.series-wrap{grid-template-columns:1fr}}

/* rows */
.rows{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm)}
.row{display:flex;gap:14px;align-items:center;padding:16px 22px;border-top:1px solid var(--line);transition:background .25s,padding-left .25s}
.row:first-child{border-top:0}
.row:hover{background:linear-gradient(90deg,#f4f9fd,transparent);padding-left:28px}
.row__date{font-family:var(--lat);color:var(--sub);font-size:.9rem;min-width:78px}
.row__title{font-size:.95rem;flex:1}
.row:hover .row__title{color:var(--navy)}
@media(max-width:560px){.row{flex-wrap:wrap;gap:6px 12px}.row__title{flex:1 1 100%}}

/* more link */
.more{margin-top:28px;display:flex;justify-content:center}
.more a{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--navy);font-size:.95rem;padding-bottom:4px;
  border-bottom:2px solid;border-image:var(--grad-gold) 1;transition:gap .25s}
.more a:hover{gap:14px}

/* founder */
.founder{display:grid;grid-template-columns:.9fr 1.3fr;gap:48px;align-items:center}
.founder__img{aspect-ratio:1/1;border-radius:20px;background:var(--grad-deep);background-size:cover;background-position:center;box-shadow:var(--shadow);position:relative}
.founder__img::after{content:"";position:absolute;inset:0;border-radius:20px;box-shadow:inset 0 0 0 6px rgba(255,255,255,.25)}
.founder h2{font-family:var(--serif);font-size:1.75rem;font-weight:600;line-height:1.5;margin-bottom:.4em}
.founder__role{font-weight:700;font-size:.92rem;letter-spacing:.04em;margin-bottom:1em;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.founder p{color:var(--sub);margin-bottom:1.4em}
@media(max-width:820px){.founder{grid-template-columns:1fr;gap:30px}}

/* join cta */
.join{color:#f4faff;border-radius:24px;padding:70px 40px;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(125deg,#163f68,#2a6aa3 55%,#4f9ad0);background-size:200% 200%;animation:heroGrad 18s ease infinite}
.join::before{content:"";position:absolute;top:-30%;left:-5%;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(227,198,132,.3),transparent 60%);animation:floatY 8s ease-in-out infinite}
.join::after{content:"";position:absolute;bottom:-40%;right:-8%;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 62%)}
.join>*{position:relative;z-index:2}
.join h2{font-family:var(--serif);font-size:clamp(1.5rem,3.4vw,2.3rem);font-weight:600;line-height:1.5;margin:.3em 0 .6em}
.join p{color:#e3eef9;max-width:34em;margin:0 auto 32px}
.join__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
@media(max-width:560px){.join{padding:52px 22px}}

/* mobile tuning */
@media(max-width:600px){
  .section{padding:60px 0}
  .hero__in{padding:84px 0 72px}
  .hero__lead{font-size:1rem}
  .hero__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:38px}
  .hero__stats>div{min-width:0}
  .hero__stats div b{font-size:1.45rem}
  .hero__stats div span{font-size:.66rem;letter-spacing:0;line-height:1.35;display:block;overflow-wrap:anywhere}
  .sec-head{margin-bottom:30px}
  .founder h2{font-size:1.45rem}
}
