/* Widerloom public experience layer
   Visual storytelling shared across home, about, product, legal, and trust surfaces.
   CSP-safe external stylesheet. */

:root{
  --exp-plum:#68445f;
  --exp-moss:#35644a;
  --exp-gold:#b98037;
  --exp-sky:#567c91;
  --exp-violet:#7566a8;
  --exp-ink:#191817;
  --exp-soft:rgba(25,24,23,.045);
  --exp-radius:24px;
}

body.public-experience{
  background:
    radial-gradient(circle at 90% 4%,rgba(117,102,168,.08),transparent 28rem),
    radial-gradient(circle at 8% 36%,rgba(185,128,55,.06),transparent 30rem),
    var(--paper);
}

.public-experience .site-header{
  position:relative;
  z-index:10;
}

.public-experience .site-header nav{
  align-items:center;
}

.public-experience .hero{
  min-height:72vh;
  grid-template-columns:minmax(0,1fr) minmax(280px,.42fr);
  gap:56px;
  align-items:center;
  align-content:center;
}

.public-experience .hero-copy{
  max-width:680px;
}

.hero-visual{
  width:100%;
  aspect-ratio:1;
  position:relative;
  display:grid;
  place-items:center;
}

.hero-orbit{
  width:min(100%,360px);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid var(--line);
  position:relative;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at center,rgba(255,253,249,.9) 0 41%,transparent 42%);
}

.hero-orbit:before,.hero-orbit:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid var(--line);
}
.hero-orbit:before{inset:12%}
.hero-orbit:after{inset:28%}

.hero-orbit-core{
  width:110px;
  height:110px;
  border-radius:50%;
  display:grid;
  place-items:center;
  text-align:center;
  background:var(--ink);
  color:var(--paper);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  line-height:1.25;
  z-index:2;
}

.hero-orbit-node{
  position:absolute;
  width:92px;
  min-height:54px;
  padding:9px 10px;
  border:1px solid var(--line);
  background:var(--paper-2);
  border-radius:999px;
  display:grid;
  place-items:center;
  text-align:center;
  font-size:.68rem;
  line-height:1.15;
  box-shadow:0 10px 30px rgba(25,24,23,.06);
}
.hero-orbit-node:nth-child(2){top:-5px;left:50%;transform:translateX(-50%);border-color:rgba(53,100,74,.35)}
.hero-orbit-node:nth-child(3){right:-20px;top:26%;border-color:rgba(185,128,55,.38)}
.hero-orbit-node:nth-child(4){right:5%;bottom:8%;border-color:rgba(117,102,168,.38)}
.hero-orbit-node:nth-child(5){left:5%;bottom:8%;border-color:rgba(86,124,145,.4)}
.hero-orbit-node:nth-child(6){left:-20px;top:26%;border-color:rgba(104,68,95,.36)}

.north-star{
  padding:110px 0;
  border-top:1px solid var(--line);
}

.north-star-head{
  display:grid;
  grid-template-columns:1fr .65fr;
  gap:60px;
  align-items:end;
  margin-bottom:36px;
}

.north-star-head h2{
  margin-bottom:0;
}

.north-star-head p{
  color:var(--muted);
  max-width:560px;
  margin:0;
}

.north-star-path{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  border:1px solid var(--line);
  border-radius:var(--exp-radius);
  overflow:hidden;
  background:var(--paper-2);
}

.north-star-step{
  min-height:205px;
  padding:22px;
  border-right:1px solid var(--line);
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.north-star-step:last-child{border-right:0}

.north-star-step span{
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:var(--muted);
}

.north-star-step strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.55rem;
  line-height:1.05;
  font-weight:400;
  max-width:150px;
}

.north-star-step:after{
  content:"";
  width:56px;
  height:8px;
  border-radius:999px;
  background:var(--exp-moss);
  opacity:.75;
}
.north-star-step:nth-child(2):after{background:var(--exp-gold)}
.north-star-step:nth-child(3):after{background:var(--exp-violet)}
.north-star-step:nth-child(4):after{background:var(--exp-sky)}
.north-star-step:nth-child(5):after{background:var(--exp-plum)}

.public-experience .manifesto-grid{
  align-items:start;
}

.public-experience .manifesto-grid h2{
  position:sticky;
  top:24px;
}

.public-experience .principle-grid article{
  min-height:260px;
  border:1px solid var(--line);
  border-top:4px solid var(--ink);
  padding:20px;
  background:var(--paper-2);
}
.public-experience .principle-grid article:nth-child(1){border-top-color:var(--exp-moss)}
.public-experience .principle-grid article:nth-child(2){border-top-color:var(--exp-gold)}
.public-experience .principle-grid article:nth-child(3){border-top-color:var(--exp-violet)}
.public-experience .principle-grid article:nth-child(4){border-top-color:var(--exp-sky)}

.public-experience .product-card{
  border-radius:var(--exp-radius);
  overflow:hidden;
  box-shadow:0 16px 44px rgba(25,24,23,.06);
}

.about-hero{
  display:grid;
  grid-template-columns:1fr .75fr;
  gap:60px;
  align-items:end;
  margin-bottom:72px;
}

.about-mark{
  border:1px solid var(--line);
  border-radius:var(--exp-radius);
  padding:26px;
  background:var(--paper-2);
}

.about-mark-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.about-mark-cell{
  min-height:170px;
  border-radius:18px;
  padding:18px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:rgba(53,100,74,.07);
}
.about-mark-cell:nth-child(2){background:rgba(117,102,168,.08)}
.about-mark-cell strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:2rem;
  font-weight:400;
}
.about-mark-cell span{
  color:var(--muted);
  font-size:.8rem;
}

.about-pillars{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
  margin:56px 0 80px;
}

.about-pillar{
  min-height:190px;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:var(--paper-2);
}

.about-pillar strong{
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.about-pillar i{
  display:block;
  width:100%;
  height:10px;
  border-radius:999px;
  background:var(--exp-moss);
}
.about-pillar:nth-child(2) i{background:var(--exp-gold)}
.about-pillar:nth-child(3) i{background:var(--exp-violet)}
.about-pillar:nth-child(4) i{background:var(--exp-sky)}
.about-pillar:nth-child(5) i{background:var(--exp-plum)}

.decision-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);
  gap:56px;
  align-items:end;
  margin-bottom:70px;
}

.decision-anatomy{
  border:1px solid var(--line);
  border-radius:var(--exp-radius);
  padding:22px;
  background:var(--paper-2);
}

.decision-anatomy h2{
  font-size:1rem;
  font-family:inherit;
  font-weight:700;
  letter-spacing:0;
  margin-bottom:18px;
}

.decision-anatomy-list{
  display:grid;
  gap:8px;
}

.decision-anatomy-row{
  min-height:46px;
  display:grid;
  grid-template-columns:28px 1fr;
  gap:10px;
  align-items:center;
  border-radius:12px;
  padding:8px 10px;
  background:var(--exp-soft);
}

.decision-anatomy-row b{
  width:24px;
  height:24px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--ink);
  color:var(--paper);
  font-size:.62rem;
}

.decision-anatomy-row span{
  font-size:.78rem;
  color:var(--muted);
}

.decision-flow{
  margin:56px 0 72px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border:1px solid var(--line);
  border-radius:var(--exp-radius);
  overflow:hidden;
  background:var(--paper-2);
}

.decision-flow-step{
  min-height:150px;
  padding:18px;
  border-right:1px solid var(--line);
}
.decision-flow-step:last-child{border-right:0}

.decision-flow-step span{
  display:block;
  font-size:.65rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:28px;
}

.decision-flow-step strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.35rem;
  font-weight:400;
  line-height:1.05;
}

.legal-experience .page-head{
  border-bottom:1px solid var(--line);
  padding-bottom:42px;
}

.legal-experience .prose{
  max-width:840px;
}

.legal-experience .prose h2{
  position:relative;
  padding-left:22px;
}

.legal-experience .prose h2:before{
  content:"";
  position:absolute;
  left:0;
  top:.2em;
  bottom:.2em;
  width:4px;
  border-radius:999px;
  background:var(--exp-moss);
}

@media(max-width:900px){
  .public-experience .hero,
  .north-star-head,
  .about-hero,
  .decision-hero{
    grid-template-columns:1fr;
  }
  .hero-visual{max-width:430px;margin:20px auto 0}
  .north-star-path{grid-template-columns:1fr 1fr}
  .north-star-step:nth-child(2n){border-right:0}
  .about-pillars{grid-template-columns:1fr 1fr}
  .decision-flow{grid-template-columns:1fr 1fr}
  .decision-flow-step:nth-child(2n){border-right:0}
}

@media(max-width:640px){
  .public-experience .site-header{
    padding:18px 0;
  }
  .public-experience .site-header nav{
    display:flex;
    gap:14px;
    overflow-x:auto;
    white-space:nowrap;
    scrollbar-width:none;
  }
  .public-experience .site-header nav::-webkit-scrollbar{display:none}
  .public-experience .site-header nav a{font-size:.74rem}
  .public-experience .hero{
    padding:58px 0 68px;
    min-height:auto;
    gap:26px;
  }
  .public-experience .hero h1{
    font-size:clamp(3.25rem,15vw,4.8rem);
    line-height:.92;
  }
  .hero-visual{margin-top:8px}
  .hero-orbit{width:280px}
  .hero-orbit-node{width:80px;min-height:48px;font-size:.6rem}
  .hero-orbit-node:nth-child(3){right:-8px}
  .hero-orbit-node:nth-child(6){left:-8px}
  .north-star{padding:72px 0}
  .north-star-head{display:block;margin-bottom:24px}
  .north-star-head h2{font-size:2.4rem}
  .north-star-head p{font-size:.86rem;margin-top:14px}
  .north-star-path{grid-template-columns:1fr;border-radius:18px}
  .north-star-step{min-height:116px;border-right:0;border-bottom:1px solid var(--line);padding:16px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
  .north-star-step:last-child{border-bottom:0}
  .north-star-step strong{font-size:1.25rem}
  .north-star-step:after{width:44px;height:44px;border-radius:50%;grid-row:1 / span 2;grid-column:2}
  .public-experience .manifesto,.public-experience .products,.public-experience .how,.public-experience .closing{padding:74px 0}
  .public-experience .manifesto-grid h2{position:static}
  .public-experience .principle-grid{grid-template-columns:1fr 1fr;gap:10px}
  .public-experience .principle-grid article{min-height:190px;padding:14px}
  .public-experience .principle-grid h3{font-size:1.28rem}
  .public-experience .principle-grid p{font-size:.78rem}
  .about-hero{display:block;margin-bottom:46px}
  .about-hero .page-head{margin-bottom:28px}
  .about-mark{padding:14px;border-radius:18px}
  .about-mark-cell{min-height:130px;padding:14px}
  .about-mark-cell strong{font-size:1.55rem}
  .about-pillars{grid-template-columns:1fr 1fr;gap:8px;margin:36px 0 52px}
  .about-pillar{min-height:130px;padding:14px}
  .decision-hero{display:block;margin-bottom:40px}
  .decision-hero .page-head{margin-bottom:28px}
  .decision-anatomy{padding:14px;border-radius:18px}
  .decision-flow{grid-template-columns:1fr 1fr;border-radius:18px;margin:36px 0 48px}
  .decision-flow-step{min-height:120px;padding:14px}
  .decision-flow-step span{margin-bottom:18px}
  .decision-flow-step strong{font-size:1.08rem}
  .public-experience .product-page-grid{gap:30px}
  .public-experience .purchase-panel{position:static;border-radius:18px}
}

@media(max-width:430px){
  .public-experience .principle-grid{grid-template-columns:1fr}
  .about-pillars{grid-template-columns:1fr}
}

/* Legal and policy pages: answer-first summary, full text remains below */
.legal-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:-18px 0 64px;
}
.legal-summary-card{
  min-height:175px;
  padding:18px;
  border-radius:18px;
  border:1px solid var(--line);
  background:var(--paper-2);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.legal-summary-card span{
  font-size:.66rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:var(--muted);
}
.legal-summary-card strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.45rem;
  line-height:1.08;
  font-weight:400;
}
.legal-summary-card i{
  width:56px;
  height:8px;
  border-radius:999px;
  background:var(--exp-moss);
}
.legal-summary-card:nth-child(2) i{background:var(--exp-gold)}
.legal-summary-card:nth-child(3) i{background:var(--exp-violet)}
.legal-summary-card:nth-child(4) i{background:var(--exp-sky)}
.legal-summary-card:nth-child(5) i{background:var(--exp-plum)}
.legal-summary-card:nth-child(6) i{background:var(--ink)}
.legal-updated{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 26px;
  font-size:.74rem;
  color:var(--muted);
}
.legal-updated:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--exp-moss);
}
@media(max-width:700px){
  .legal-summary{grid-template-columns:1fr 1fr;margin-top:-28px;margin-bottom:44px}
  .legal-summary-card{min-height:130px;padding:14px}
  .legal-summary-card strong{font-size:1.18rem}
}
@media(max-width:430px){
  .legal-summary{grid-template-columns:1fr}
  .legal-summary-card{min-height:105px}
}
