/**
 * Interface 127 — Design system géométrique.
 *
 * Modes : linéaire pour les contenus, radial pour le Cercle, constellation
 * uniquement lorsque des relations réelles sont disponibles.
 */

:root{
  /* Couleurs fonctionnelles */
  --i127-color-void:#070a15;
  --i127-color-night:#080b17;
  --i127-color-surface:#12172a;
  --i127-color-text:#f2eadc;
  --i127-color-muted:#aab2c6;
  --i127-color-gold:#dfc27d;
  --i127-color-violet:#a798ee;
  --i127-sister-oni:#d9cdfb;
  --i127-sister-alka:#a9c2f7;
  --i127-sister-naia:#8fdad3;
  --i127-sister-terra:#a9c98a;
  --i127-sister-ignis:#eb9a68;
  --i127-sister-astria:#f2dea8;
  --i127-sister-irma:#f3f1fb;

  /* Proportions, cercles et orbites */
  --geo-ratio:1.618;
  --geo-ratio-inverse:.618;
  --geo-space-1:.375rem;
  --geo-space-2:.625rem;
  --geo-space-3:1rem;
  --geo-space-4:1.625rem;
  --geo-space-5:2.625rem;
  --geo-space-6:4.25rem;
  --geo-radius-circle:50%;
  --geo-radius-soft:1.125rem;
  --geo-circle-size-sm:2.75rem;
  --geo-circle-size-md:4rem;
  --geo-circle-size-lg:7rem;
  --geo-orbit-sm:5rem;
  --geo-orbit-md:9rem;
  --geo-orbit-lg:14rem;
  --geo-line-thin:1px;
  --geo-line-medium:2px;
  --geo-line-strong:3px;
  --geo-motion-orbit:34s;
  --geo-motion-breathe:6s;
  --geo-motion-pulse:3s;
  --geo-motion-fast:180ms;
  --geo-motion-base:280ms;
  --geo-ease:cubic-bezier(.2,.8,.2,1);
  --geo-opacity-line:.24;
  --geo-opacity-soft:.12;
  --geo-opacity-focus:.72;

  /* Profondeur et couches */
  --geo-shadow-soft:0 12px 30px rgba(0,0,0,.18);
  --geo-shadow-deep:0 32px 85px rgba(0,0,0,.32);
  --geo-depth-content:1;
  --geo-depth-navigation:82;
  --geo-depth-dialog:200;
  --geo-breakpoint-compact:560px;
  --geo-breakpoint-radial:760px;
  --geo-breakpoint-wide:980px;
  --i127-copper:#c48659;
  --i127-deep:var(--i127-color-void);
}

/* Les trois grilles restent explicites et réutilisables. */
.i127-layout--linear{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--geo-space-4)}
.i127-layout--radial{position:relative;display:grid;place-items:center}
.i127-layout--constellation{position:relative;isolation:isolate}
.i127-heptagon .screen-reader-text{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Le contenu reste visible par défaut. Cette classe n'existe que lorsque le
   Motion Engine et IntersectionObserver sont réellement disponibles. */
.i127-motion-ready [data-i127-reveal]{opacity:0;transform:translateY(var(--geo-space-3));transition:opacity var(--geo-motion-base) var(--geo-ease),transform var(--geo-motion-base) var(--geo-ease)}
.i127-motion-ready [data-i127-reveal].is-visible{opacity:1;transform:none}

/* ── Portail applicatif de l'accueil ── */
.i127-home-hero{
  min-height:min(900px,calc(100svh - 80px));
  isolation:isolate;
}
.i127-home-hero::before{
  content:"";
  position:absolute;
  z-index:0;
  left:50%;
  top:52%;
  width:min(88vw,760px);
  aspect-ratio:1;
  border:1px solid rgba(215,207,249,.07);
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 70px rgba(215,207,249,.018),0 0 0 150px rgba(223,194,125,.012);
  pointer-events:none;
}
.i127-home-hero .i127-home-hero__grid{
  width:min(1180px,calc(100% - 40px));
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  align-items:center;
  gap:clamp(34px,6vw,88px);
  min-height:inherit;
  padding:clamp(55px,8vw,95px) 0;
  text-align:left;
}
.i127-home-hero__copy{position:relative;z-index:2}
.i127-home-hero .i127-home-hero__copy h1{
  max-width:15ch;
  margin:0 0 24px;
  font-size:clamp(2.45rem,5vw,4.85rem);
  line-height:.96;
  text-wrap:balance;
}
.i127-home-hero .i127-home-hero__copy .lead{max-width:660px;margin:0 0 18px}
.i127-home-hero .i127-home-hero__copy .hero-truth{justify-content:flex-start}
.i127-home-hero .i127-home-hero__copy .hero-btns{justify-content:flex-start}

.i127-portal{
  position:relative;
  z-index:2;
  width:min(100%,470px);
  aspect-ratio:1;
  margin-inline:auto;
  filter:drop-shadow(0 35px 55px rgba(0,0,0,.28));
}
.i127-portal::before,.i127-portal::after{
  content:"";
  position:absolute;
  inset:7%;
  border:1px solid rgba(223,194,125,.19);
  pointer-events:none;
}
.i127-portal::before{
  clip-path:polygon(50% 0,89% 19%,99% 61%,72% 95%,28% 95%,1% 61%,11% 19%);
  background:radial-gradient(circle at 50% 50%,rgba(167,152,238,.075),transparent 62%);
}
.i127-portal::after{inset:15%;border-radius:50%;border-color:rgba(215,207,249,.12)}
.i127-portal__vesica{position:absolute;inset:15%;pointer-events:none}
.i127-portal__vesica span{
  position:absolute;
  top:10%;
  width:66%;
  aspect-ratio:1;
  border:1px solid rgba(215,207,249,.18);
  border-radius:50%;
}
.i127-portal__vesica span:first-child{left:1%;background:radial-gradient(circle at 70% 50%,rgba(167,152,238,.12),transparent 60%)}
.i127-portal__vesica span:last-child{right:1%;background:radial-gradient(circle at 30% 50%,rgba(223,194,125,.1),transparent 60%)}
.i127-portal__center{
  position:absolute;
  left:50%;
  top:46%;
  width:clamp(158px,18vw,198px);
  aspect-ratio:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:22px;
  border:1px solid rgba(242,222,168,.68);
  border-radius:50%;
  color:var(--ivory);
  text-align:center;
  background:radial-gradient(circle at 40% 30%,rgba(215,207,249,.22),transparent 34%),linear-gradient(145deg,#15182c,#090b17);
  box-shadow:0 0 0 10px rgba(223,194,125,.04),0 22px 50px rgba(0,0,0,.42),inset 0 0 35px rgba(167,152,238,.08);
  transform:translate(-50%,-50%);
  transition:transform .28s ease,box-shadow .28s ease;
}
.i127-portal__center:hover,.i127-portal__center:focus-visible{
  transform:translate(-50%,-50%) scale(1.035);
  box-shadow:0 0 0 14px rgba(223,194,125,.07),0 28px 62px rgba(0,0,0,.48),0 0 50px rgba(223,194,125,.16);
}
.i127-portal__number{color:var(--gold);font:600 .68rem/1 "Manrope",sans-serif;letter-spacing:.18em}
.i127-portal__center strong{font:600 clamp(1.35rem,2.6vw,1.75rem)/1.02 "Cormorant Garamond",serif}
.i127-portal__center small{max-width:15ch;color:var(--muted);font-size:.66rem;line-height:1.4}
.i127-portal__routes{
  position:absolute;
  left:7%;
  right:7%;
  bottom:4%;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.i127-portal__routes a{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  align-items:center;
  min-width:0;
  padding:11px 13px;
  border:1px solid rgba(242,234,220,.12);
  border-radius:16px;
  background:rgba(8,11,23,.84);
  background:color-mix(in srgb,var(--i127-color-night) 84%,transparent);
  backdrop-filter:blur(12px);
  transition:transform var(--geo-motion-fast) var(--geo-ease),border-color var(--geo-motion-fast) var(--geo-ease),background var(--geo-motion-fast) var(--geo-ease);
}
.i127-portal__routes a:hover,.i127-portal__routes a:focus-visible{transform:translateY(-3px);border-color:rgba(223,194,125,.42);background:rgba(18,22,40,.94)}
.i127-portal__routes b{display:grid;place-items:center;width:32px;aspect-ratio:1;border:1px solid rgba(223,194,125,.34);border-radius:50%;color:var(--gold);font:.7rem/1 "Manrope",sans-serif}
.i127-portal__routes span{min-width:0}
.i127-portal__routes strong,.i127-portal__routes small{display:block}
.i127-portal__routes strong{color:var(--ivory);font:600 1rem/1.1 "Cormorant Garamond",serif}
.i127-portal__routes small{margin-top:3px;color:var(--muted);font-size:.58rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.i127-home-hero__scroll{position:absolute;left:50%;bottom:22px;width:24px;height:42px;border:1px solid rgba(242,234,220,.18);border-radius:99px;transform:translateX(-50%)}
.i127-home-hero__scroll span{position:absolute;left:50%;top:8px;width:3px;height:8px;border-radius:3px;background:var(--gold);transform:translateX(-50%)}

/* ── Cercle radial calculé ── */
.i127-circle-section{overflow:hidden;background:radial-gradient(circle at 50% 43%,rgba(167,152,238,.14),transparent 34rem),linear-gradient(180deg,#0d0b1c,#080b17)}
.i127-circle-section::before{
  content:"";
  position:absolute;
  left:50%;
  top:52%;
  width:min(920px,94vw);
  aspect-ratio:1;
  border-radius:50%;
  background:repeating-radial-gradient(circle,rgba(223,194,125,.035) 0 1px,transparent 1px 66px);
  transform:translate(-50%,-50%);
  pointer-events:none;
}
.i127-heptagon{position:relative;z-index:1;max-width:900px;margin:0 auto;color:var(--text)}
.i127-heptagon__stage{
  position:relative;
  display:grid;
  gap:var(--geo-space-4);
  padding:var(--geo-space-4);
  border:1px solid rgba(242,234,220,.1);
  border-radius:30px;
  background:linear-gradient(145deg,rgba(18,23,42,.88),rgba(7,10,20,.78));
  box-shadow:var(--geo-shadow-deep);
}
.i127-heptagon__drawing{display:none;position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.i127-heptagon__orbit{fill:none;stroke:rgba(242,234,220,.08);stroke-width:1;stroke-dasharray:2 9}
.i127-heptagon__orbit--inner{stroke:rgba(223,194,125,.13);stroke-dasharray:1 7}
.i127-heptagon__polygon{fill:rgba(167,152,238,.018);stroke:rgba(215,207,249,.25);stroke-width:1.4;stroke-linejoin:round;stroke-dasharray:7 7}
.i127-heptagon__polygon--inner{fill:none;stroke:rgba(223,194,125,.17);stroke-width:1;stroke-dasharray:2 8}
.i127-heptagon__ray{stroke:rgba(242,234,220,.09);stroke-width:1;transition:stroke .22s ease,stroke-width .22s ease,filter .22s ease}
.i127-heptagon__ray.is-active{stroke:var(--i127-active);stroke-width:2;filter:drop-shadow(0 0 5px var(--i127-active))}
.i127-heptagon__center{
  position:relative;
  z-index:3;
  width:166px;
  aspect-ratio:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  justify-self:center;
  gap:3px;
  padding:20px;
  border:1px solid rgba(223,194,125,.58);
  border-radius:50%;
  text-align:center;
  background:radial-gradient(circle at 35% 28%,rgba(215,207,249,.2),transparent 35%),linear-gradient(145deg,#17192e,#090b17);
  box-shadow:0 0 0 9px rgba(223,194,125,.035),0 18px 45px rgba(0,0,0,.4),0 0 42px rgba(167,152,238,.12);
  transition:transform .25s ease,box-shadow .25s ease;
}
.i127-heptagon__center:hover,.i127-heptagon__center:focus-visible{transform:scale(1.035);box-shadow:0 0 0 13px rgba(223,194,125,.06),0 24px 55px rgba(0,0,0,.48),0 0 55px rgba(223,194,125,.16)}
.i127-heptagon__center-ring{position:absolute;inset:8px;border:1px dashed rgba(215,207,249,.19);border-radius:50%;pointer-events:none}
.i127-heptagon__center small{color:var(--gold);font:700 .56rem/1 "Manrope",sans-serif;letter-spacing:.13em;text-transform:uppercase}
.i127-heptagon__center strong{color:var(--ivory);font:600 1.48rem/1.05 "Cormorant Garamond",serif}
.i127-heptagon__center>span:last-child{color:var(--muted);font-size:.63rem}
.i127-heptagon__nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.i127-heptagon__node-wrap{min-width:0}
.i127-heptagon__node{
  position:relative;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 20px;
  align-items:center;
  gap:10px;
  min-height:76px;
  padding:11px;
  overflow:hidden;
  border:1px solid rgba(242,234,220,.11);
  border-radius:18px;
  background:rgba(255,255,255,.025);
  box-shadow:0 12px 28px rgba(0,0,0,.16);
  transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;
}
.i127-heptagon__node::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.05;
  background:var(--i127-sister);
  clip-path:polygon(50% 0,89% 19%,99% 61%,72% 95%,28% 95%,1% 61%,11% 19%);
}
.i127-heptagon__node:hover,.i127-heptagon__node:focus-visible,.i127-heptagon__node.is-active{
  border-color:var(--i127-sister);
  background:rgba(255,255,255,.045);
  box-shadow:0 16px 35px rgba(0,0,0,.27),0 0 25px rgba(215,207,249,.08);
  transform:translateY(-3px);
}
.i127-heptagon__node.is-visited::after{content:"";position:absolute;right:8px;top:8px;width:5px;aspect-ratio:1;border-radius:50%;background:var(--i127-sister);box-shadow:0 0 8px var(--i127-sister)}
.i127-heptagon__portrait{width:48px;aspect-ratio:1;overflow:hidden;border:1px solid var(--i127-sister);border-radius:50%;background:#101426;box-shadow:0 0 16px rgba(0,0,0,.28)}
.i127-heptagon__portrait img{width:100%;height:100%;object-fit:cover}
.i127-heptagon__identity{min-width:0}
.i127-heptagon__identity small,.i127-heptagon__identity strong,.i127-heptagon__identity>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.i127-heptagon__identity small{color:var(--i127-sister);font:700 .53rem/1.2 "Manrope",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.i127-heptagon__identity strong{margin-top:4px;color:var(--ivory);font:600 1.14rem/1 "Cormorant Garamond",serif}
.i127-heptagon__identity>span{margin-top:4px;color:var(--muted);font-size:.6rem}
.i127-heptagon__glyph{color:var(--i127-sister);font-size:1rem;text-align:center}
.i127-heptagon__detail{
  display:grid;
  grid-template-columns:58px minmax(150px,.6fr) minmax(0,1.4fr);
  gap:18px;
  align-items:center;
  max-width:760px;
  min-height:92px;
  margin:18px auto 0;
  padding:16px 20px;
  border:1px solid rgba(242,234,220,.11);
  border-radius:20px;
  background:rgba(8,11,23,.74);
  backdrop-filter:blur(12px);
  transition:border-color .2s ease,box-shadow .2s ease;
}
.i127-heptagon__detail-mark{display:grid;place-items:center;width:52px;aspect-ratio:1;border:1px solid var(--i127-active);border-radius:50%;color:var(--i127-active);font:600 .68rem/1 "Manrope",sans-serif;box-shadow:0 0 18px rgba(223,194,125,.08)}
.i127-heptagon__detail p{margin:0}
.i127-heptagon__detail p:nth-child(2) small,.i127-heptagon__detail p:nth-child(2) strong{display:block}
.i127-heptagon__detail small{color:var(--i127-active);font:.58rem/1.3 "Manrope",sans-serif;letter-spacing:.06em;text-transform:uppercase}
.i127-heptagon__detail strong{margin-top:4px;color:var(--ivory);font:600 1.35rem/1 "Cormorant Garamond",serif}
.i127-heptagon__detail>p:last-child{color:var(--muted);font-size:.78rem;line-height:1.55}
.i127-heptagon__actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}

/* ── La Vesica Piscis sert uniquement aux zones de dialogue ── */
.interface127 .oschat-shell{position:relative;isolation:isolate}
.interface127 .oschat-shell::before,.interface127 .oschat-shell::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:16%;
  width:56%;
  aspect-ratio:1;
  border:1px solid color-mix(in srgb,var(--oschat-accent) 16%,transparent);
  border-radius:50%;
  pointer-events:none;
}
.interface127 .oschat-shell::before{left:9%;background:radial-gradient(circle at 70% 50%,color-mix(in srgb,var(--oschat-accent) 6%,transparent),transparent 62%)}
.interface127 .oschat-shell::after{right:9%;background:radial-gradient(circle at 30% 50%,rgba(215,207,249,.035),transparent 62%)}

/* ── Signatures géométriques discrètes des pages linéaires ── */
.interface127 .page-hero{position:relative;overflow:hidden;isolation:isolate}
.interface127 .page-hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  right:clamp(-130px,-8vw,-50px);
  top:50%;
  width:310px;
  aspect-ratio:1;
  border:1px solid rgba(223,194,125,.09);
  border-radius:50%;
  box-shadow:0 0 0 45px rgba(167,152,238,.02),0 0 0 92px rgba(223,194,125,.015);
  transform:translateY(-50%);
}
.interface127 .promise,.interface127 .offer,.interface127 .lineage,.interface127 .adventure-card,.interface127 .page-bridge__inner{border-radius:calc(var(--geo-radius-soft) * var(--geo-ratio))}
.interface127 .oni-app-nav__item--featured .oni-app-nav__icon::before{
  content:"";
  position:absolute;
  inset:-7px;
  border:1px dashed rgba(223,194,125,.34);
  border-radius:50%;
}

@media(min-width:760px){
  .i127-heptagon.is-enhanced .i127-heptagon__stage{
    width:min(100%,680px);
    height:680px;
    margin-inline:auto;
    padding:0;
    border-radius:50%;
    background:radial-gradient(circle at center,rgba(167,152,238,.08),rgba(8,11,23,.55) 44%,rgba(8,11,23,.08) 72%);
  }
  .i127-heptagon.is-enhanced .i127-heptagon__drawing{display:block}
  .i127-heptagon.is-enhanced .i127-heptagon__center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
  .i127-heptagon.is-enhanced .i127-heptagon__center:hover,.i127-heptagon.is-enhanced .i127-heptagon__center:focus-visible{transform:translate(-50%,-50%) scale(1.04)}
  .i127-heptagon.is-enhanced .i127-heptagon__nodes{position:absolute;inset:0;display:block}
  .i127-heptagon.is-enhanced .i127-heptagon__node-wrap{position:absolute;left:var(--i127-x);top:var(--i127-y);width:168px;transform:translate(-50%,-50%)}
  .i127-heptagon.is-enhanced .i127-heptagon__node{grid-template-columns:43px minmax(0,1fr);min-height:68px;padding:9px}
  .i127-heptagon.is-enhanced .i127-heptagon__portrait{width:43px}
  .i127-heptagon.is-enhanced .i127-heptagon__glyph{position:absolute;right:9px;bottom:7px;font-size:.72rem;opacity:.72}
}

@media(max-width:980px){
  .i127-home-hero .i127-home-hero__grid{grid-template-columns:1fr;max-width:760px;text-align:center;padding-top:70px}
  .i127-home-hero .i127-home-hero__copy h1{margin-inline:auto}
  .i127-home-hero .i127-home-hero__copy .lead{margin-inline:auto}
  .i127-home-hero .i127-home-hero__copy .hero-truth,.i127-home-hero .i127-home-hero__copy .hero-btns{justify-content:center}
  .i127-portal{max-width:440px}
}

@media(max-width:759px){
  .i127-circle-section{padding-inline:0}
  .i127-heptagon{max-width:600px}
  .i127-heptagon__stage{padding:20px}
  .i127-heptagon__detail{grid-template-columns:48px 1fr;gap:12px}
  .i127-heptagon__detail-mark{width:44px;grid-row:1/3}
  .i127-heptagon__detail>p:last-child{grid-column:2}
}

@media(max-width:560px){
  .i127-home-hero{min-height:auto}
  .i127-home-hero .i127-home-hero__grid{width:min(100% - 28px,760px);gap:20px;padding:48px 0 62px}
  .i127-home-hero .i127-home-hero__copy h1{font-size:clamp(2.35rem,12vw,3.6rem)}
  .i127-home-hero .i127-home-hero__copy .lead{font-size:1rem}
  .i127-home-hero__scroll{display:none}
  .i127-portal{width:100%;height:350px;aspect-ratio:auto}
  .i127-portal::before{inset:1% 5% 3%}
  .i127-portal::after{inset:10% 14% 13%}
  .i127-portal__vesica{inset:10% 13% 18%}
  .i127-portal__center{top:43%;width:164px}
  .i127-portal__routes{left:2%;right:2%;bottom:0}
  .i127-heptagon__nodes{grid-template-columns:1fr}
  .i127-heptagon__node{min-height:72px}
  .i127-heptagon__detail{display:grid;grid-template-columns:42px 1fr;padding:14px}
  .i127-heptagon__detail-mark{width:40px}
  .i127-heptagon__actions{align-items:stretch;flex-direction:column}
  .i127-heptagon__actions .btn{width:100%}
}

@media(max-width:380px){
  .i127-portal__routes{grid-template-columns:1fr;bottom:-16px}
  .i127-portal__routes a{min-height:54px}
  .i127-portal__routes a:last-child{display:none}
  .i127-heptagon__stage{padding:14px;border-radius:22px}
}

@media(prefers-reduced-motion:no-preference){
  .i127-home-hero__scroll span{animation:i127-scroll 2.3s ease-in-out infinite}
  .i127-portal::before{animation:i127-breathe var(--geo-motion-breathe) ease-in-out infinite}
  .i127-heptagon.is-enhanced .i127-heptagon__polygon{animation:i127-dash 24s linear infinite}
  .i127-heptagon__center-ring{animation:i127-turn var(--geo-motion-orbit) linear infinite}
  .interface127 .oni-app-nav__item--featured .oni-app-nav__icon::before{animation:i127-turn 18s linear infinite}
}

@media(prefers-reduced-motion:reduce){
  .i127-portal *,.i127-heptagon *,.i127-home-hero__scroll span,[data-i127-reveal]{animation:none!important;transition-duration:.01ms!important}
  .i127-motion-ready [data-i127-reveal]{opacity:1;transform:none}
}

@keyframes i127-scroll{0%,100%{transform:translate(-50%,0);opacity:.35}50%{transform:translate(-50%,15px);opacity:1}}
@keyframes i127-breathe{0%,100%{transform:scale(1);opacity:.72}50%{transform:scale(1.018);opacity:1}}
@keyframes i127-dash{to{stroke-dashoffset:-140}}
@keyframes i127-turn{to{transform:rotate(360deg)}}
