/* Look v4 (1 Nov 2026): v3's layout with Róisín's real material.
   Adds: her logo, the kind-words strip under the top, her own words and
   photos, her product squares (each goes to Pensight), all nine testimonials
   by the footer, her fairy drawings and the free masterclass pop-up. */

[hidden] { display: none !important; }

/* her name: RebornX (her Reborn), lower case */
.hero-name, footer .f-word { font-family: 'Poiret One', sans-serif; text-transform: none; font-weight: 400; letter-spacing: .01em; line-height: 1; }
.hero-name { font-size: clamp(84px, 12.4vw, 190px); -webkit-text-stroke: 1.5px var(--cream); text-shadow: 0 4px 30px rgba(10,15,5,.55); }
.hero-name .l1 { display: block; }
.hero-name .l2 { padding-left: .55em; }
footer .f-word { -webkit-text-stroke: 1px var(--cream); }
/* the enchanted forest at the top */
.hero-photo img { object-position: center 55%; filter: saturate(.95) contrast(1.04) brightness(.82) sepia(.08); }
.stars { color: #d98b84; letter-spacing: .12em; font-size: 14px; }

/* her logo */
.nav .logo img { height: 46px; width: auto; display: block; }
.badge .core { background: var(--paper); }
.badge .core img { width: 74%; height: auto; }

/* her fairy drawings: black lines, made cream on dark or olive ground */
.fairy { display: block; height: auto; pointer-events: none; }
.intro .fairy, .community .fairy, footer .fairy { filter: invert(1) sepia(.35) saturate(.8) brightness(1.02); }

/* ---------- kind words straight under the top ---------- */
.proof { background: var(--paper); padding: 30px 0 36px; border-bottom: 1px solid rgba(42,26,31,.12); overflow: hidden; }
.proof-head { display: flex; justify-content: center; align-items: center; gap: 18px; flex-wrap: wrap; padding: 0 var(--gutter) 22px; font-size: 11px; }
.proof-head a { color: var(--plum); border-bottom: 1px solid currentColor; }
.proof-track { overflow: hidden; }
.proof-row { display: inline-flex; animation: marquee 80s linear infinite; }
.proof-track:hover .proof-row { animation-play-state: paused; }
.proof figure { flex: none; width: 340px; margin: 0 9px; background: #fbf6ea; border-radius: 18px; padding: 20px 24px 22px; box-shadow: 0 14px 30px -24px rgba(40,20,10,.55); }
.proof blockquote { font-family: 'Fraunces', serif; font-style: italic; font-weight: 500; font-size: 19px; line-height: 1.35; margin: 8px 0 12px; color: var(--ink); white-space: normal; }
.proof figcaption { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--plum); }

/* ---------- her opening words on olive ---------- */
.intro .fairy-top { width: 120px; margin: 0 auto 30px; }
.intro .quote { font-family: 'Poiret One', sans-serif; font-size: clamp(24px, 2.5vw, 38px); line-height: 1.38; max-width: 940px; margin: 0 auto; color: var(--cream); letter-spacing: .01em; }
.intro .lede { margin-top: 30px; max-width: 680px; }
.intro h2 { margin-top: 80px; }
.intro-grid { display: grid; grid-template-columns: 640px 1fr; gap: 64px; max-width: 1240px; margin: 80px auto 0; text-align: left; align-items: center; }
.intro-grid .collage { margin: 0; }
.intro-words p { font-size: 19px; color: #f6eed6; margin-bottom: 18px; }
.intro .intro-words .pill { margin-top: 14px; }

/* ---------- podcast on her own photo ---------- */
.podcast > img { object-position: 20% 35%; }
.podcast .listen a { display: inline-flex; }
.player { color: inherit; }

/* ---------- her product squares ---------- */
.shop { position: relative; }
.fairy-shop { position: absolute; right: 5%; top: 60px; width: 150px; opacity: .85; }
.squares { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 30px; max-width: 1240px; margin: 0 auto; }
.sq { display: block; }
.sq .img { position: relative; aspect-ratio: 1; border-radius: 18px; overflow: hidden; box-shadow: 0 26px 46px -30px rgba(40,20,10,.6); }
.sq .img img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.sq:hover .img img { transform: scale(1.05); }
.sq .tag { position: absolute; left: 14px; top: 14px; background: var(--rose); color: var(--ink); }
.sq .meta { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 16px; }
.sq h3 { font-size: 25px; }
.sq p { font-size: 15px; color: #5a4a44; margin-top: 2px; }
.sq .price { flex: none; font-family: 'Ovo', serif; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; background: var(--plum); color: var(--cream); padding: 9px 15px; border-radius: 999px; transition: background .3s; }
.sq:hover .price { background: var(--ink); }
.sq.free .price { background: var(--rose); color: var(--ink); }

/* ---------- The Enchanted Nook ---------- */
.community .fairy-nook { width: 130px; margin: 0 auto 26px; }

/* ---------- all nine kind words ---------- */
.kind { padding: 120px var(--gutter) 110px; background: var(--paper); position: relative; }
.k-head { text-align: center; position: relative; max-width: 1320px; margin: 0 auto; }
.fairy-kind { position: absolute; right: 2%; top: -30px; width: 130px; opacity: .85; }
.k-head h2 { font-size: clamp(70px, 9vw, 140px); color: var(--ink); }
.big-stars { display: block; font-size: 26px; margin-top: 16px; }
.k-cols { columns: 3 320px; column-gap: 26px; max-width: 1320px; margin: 60px auto 0; }
.k-cols figure { break-inside: avoid; background: #fbf6ea; border-radius: 18px; padding: 26px 28px; margin: 0 0 26px; box-shadow: 0 20px 40px -32px rgba(40,20,10,.55); display: inline-block; width: 100%; }
.k-cols blockquote { font-size: 16.5px; line-height: 1.65; color: #3b2a2c; margin-top: 10px; }
.k-cols figcaption { font-family: 'Fraunces', serif; font-weight: 800; font-variation-settings: 'SOFT' 100; font-size: 21px; color: var(--plum); margin-top: 14px; }

.k-more { display: none; }

/* ---------- footer ---------- */
.f-brand { display: flex; align-items: flex-end; gap: 30px; }
.f-logo { width: 130px; height: auto; flex: none; margin-bottom: 10px; }
footer .f-word { font-size: clamp(60px, 7.6vw, 124px); }
.news { position: relative; }
.fairy-news { width: 84px; margin-bottom: 14px; }
.news .work { display: inline-block; margin-top: 24px; color: var(--rose); font-size: 12px; border-bottom: 1px solid currentColor; }
.f-bottom .links a { display: inline-flex; align-items: center; gap: 8px; }
.f-bottom .links svg { width: 18px; height: 18px; color: var(--cream); }

/* ---------- free masterclass pop-up ---------- */
.pop { position: fixed; inset: 0; z-index: 200; background: rgba(30,18,22,.62); backdrop-filter: blur(4px); display: grid; place-items: center; padding: 18px; animation: popfade .45s ease; }
.pop-card { position: relative; width: min(860px, 100%); background: var(--paper); border-radius: 24px; overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); animation: poprise .55s cubic-bezier(.2,.7,.2,1); }
.pop-card > img { width: 100%; height: 100%; object-fit: cover; }
.pop-body { padding: 44px 40px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.pop-body .label { color: var(--plum); font-size: 11px; }
.pop-body h3 { font-size: 36px; margin: 14px 0 12px; }
.pop-body p { font-size: 17px; color: #4a3a36; margin-bottom: 26px; }
.pop-no { margin-top: 16px; font-size: 11px; color: #6b5a52; border-bottom: 1px solid currentColor; }
.pop-x { position: absolute; top: 10px; right: 16px; font-size: 32px; line-height: 1; color: var(--ink); z-index: 2; }
@keyframes popfade { from { opacity: 0; } }
@keyframes poprise { from { opacity: 0; transform: translateY(26px) scale(.97); } }

/* phone menu */
@media (max-width: 1020px) {
  .nav.open ul { display: flex; flex-direction: column; gap: 0; position: absolute; left: 0; right: 0; top: 100%; background: var(--paper); border-bottom: 1px solid rgba(42,26,31,.15); padding: 8px 18px 18px; font-size: 13px; box-shadow: 0 20px 30px -20px rgba(0,0,0,.35); }
  .nav.open ul li { display: block !important; }
  .nav.open ul li a { display: block; padding: 14px 4px; border-bottom: 1px solid rgba(42,26,31,.1); }
  .nav.open .burger span { opacity: 0; }
  .nav.open .burger::before { top: 8px; transform: rotate(45deg); }
  .nav.open .burger::after { bottom: 8px; transform: rotate(-45deg); }
  .burger::before, .burger::after, .burger span { transition: transform .3s, opacity .3s, top .3s, bottom .3s; }
}
@media (max-width: 1100px) {
  .intro-grid { grid-template-columns: minmax(0, 1fr); gap: 50px; justify-items: center; }
  .intro-grid .collage { width: 100%; max-width: 640px; }
  .intro-words { max-width: 640px; }
  .fairy-kind { width: 90px; top: -50px; }
}
@media (max-width: 900px) {
  .squares { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .nav .logo img { height: 36px; }
  .hero-name { font-size: 19vw; }
  .hero-name .l2 { padding-left: 0; }
  .badge .core img { width: 60%; }
  .proof figure { width: 270px; }
  .proof blockquote { font-size: 17px; }
  .intro .fairy-top { width: 90px; }
  .intro .quote { font-size: 23px; }
  .intro h2 { margin-top: 56px; }
  .intro-grid { margin-top: 50px; }
  .intro-words p { font-size: 17px; }
  .squares { gap: 26px 14px; }
  .sq .meta { flex-direction: column; align-items: flex-start; gap: 8px; }
  .sq h3 { font-size: 19px; }
  .sq p { font-size: 13px; }
  .sq .price { font-size: 10px; padding: 7px 12px; }
  .kind { padding: 80px 18px; }
  .k-head h2 { font-size: 18vw; }
  .k-cols { columns: 1; margin-top: 40px; }
  .kind:not(.open) .k-cols figure:nth-child(n+5) { display: none; }
  .k-more { display: block; text-align: center; margin-top: 10px; }
  .kind.open .k-more { display: none; }
  .fairy-kind { display: none; }
  .f-brand { flex-direction: column; align-items: flex-start; gap: 18px; }
  .f-logo { width: 80px; }
  .fairy-news { width: 70px; }
  .pop-card { grid-template-columns: 1fr; max-height: 92vh; overflow: auto; }
  .pop-card > img { height: 240px; }
  .pop-body { padding: 28px 24px 30px; }
  .pop-body h3 { font-size: 28px; }
}

/* 10 Nov 2026: her name as in her Canva picture: thin capitals (Raleway),
   with a small raised S and a small raised EEFFE. Replaces the RebornX name. */
.hero-name, footer .f-word { font-family: 'Raleway', 'Poiret One', sans-serif; font-weight: 200; text-transform: uppercase; letter-spacing: .07em; line-height: 1.05; -webkit-text-stroke: 0; }
.hero-name { font-size: clamp(60px, 8.4vw, 148px); white-space: nowrap; text-shadow: 0 4px 30px rgba(10,15,5,.55); }
.hero-name .l1, .hero-name .l2 { display: inline; }
.hero-name .l2 { padding-left: .32em; }
.hero-name .up, footer .f-word .up { display: inline !important; padding: 0 !important; font-size: .62em; vertical-align: .5em; letter-spacing: .07em; }
footer .f-word { font-size: clamp(48px, 6.2vw, 104px); -webkit-text-stroke: 0; }
footer .f-word > span { display: block; }
footer .f-word > span:last-child { padding-left: .9em; }
@media (max-width: 760px) {
  .hero-name { font-size: 15.5vw; white-space: normal; }
  .hero-name .l1, .hero-name .l2 { display: block; padding-left: 0; }
  footer .f-word { font-size: 14vw; }
  footer .f-word > span:last-child { padding-left: 0; }
}
