/* SCS HOMESCHOOL · THE SHARED LOOK (29 Oct 2026). ONE design system for both layers: the public sales page now, the member
   pages (student + parent) after Julie approves the alignment pass. Her direction, 28 Oct night: "very elevated, chic…
   National Geographic teen, but also marketing to these parents"; "organized first, then engaging"; no rainbow.
     · base: cream / paper and white; lead: DEEP TEAL + GOLD; CORAL only for the main buttons;
       pink and turquoise as tiny accents (a sticker, a pin), never a wash, never headline script
     · fun comes from real photos, the characters, the stamps and real screens, placed neatly
     · the sunburst only as a HINT behind a stamp (the TPT covers' recipe, one gold hue): .sol-pista
   Loaded AFTER sitio_base.css + revista.css. Contrast: every text pairing below is ≥ 4.5:1 (checked by verifica_homeschool.py). */
:root{
  --hs-papel:#faf6ee; --hs-blanco:#ffffff; --hs-arena:#f4ecdc; --hs-oro-lav:#fdf3d6;
  --hs-teal:#004c4c; --hs-teal-2:#0b5c5c; --hs-teal-lav:#e3eeec;
  --hs-oro:#f6c445; --hs-oro-hondo:#c48a1c;            /* gold is a ground or a line, never text */
  --hs-coral:#e8643c;                                    /* buttons only (charcoal type on it) */
  --hs-tinta:#1a1d20; --hs-gris:#4a5257; --hs-raya:#e7dfd0;
  --hs-rosa:#c2185b; --hs-turq:#0f8b8d;                  /* tiny accents only */
  --hs-serif:"Fraunces",Georgia,serif; --hs-sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif; --hs-script:"Caveat",cursive;
  --hs-radio:18px; --hs-sombra:0 1px 2px rgba(26,29,32,.06),0 10px 28px rgba(26,29,32,.08);
  --hs-ancho:1180px; --hs-aire:clamp(64px,8vw,104px);
}
.hs body,body.hs{background:var(--hs-papel);color:var(--hs-tinta);font-family:var(--hs-sans)}
.hs .wrap{max-width:var(--hs-ancho);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
/* sections: cream, white or pale gold; one H2, a short lead, then the content, then ONE next step */
.hs .sec{padding-block:var(--hs-aire)}
.hs .sec.blanco{background:var(--hs-blanco)}
.hs .sec.arena{background:var(--hs-arena)}
.hs .sec.oro{background:var(--hs-oro-lav)}
.hs .cab-sec{max-width:760px;margin:0 auto 44px;text-align:center}
.hs .cab-sec .kick,.hs .kick{display:block;font:700 13px/1.2 var(--hs-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--hs-teal);margin:0 0 12px}
.hs h1,.hs h2,.hs h3{font-family:var(--hs-serif);color:var(--hs-teal);letter-spacing:-.01em;text-wrap:balance;margin:0}
.hs h2{font-size:clamp(32px,4.2vw,50px);line-height:1.08}
.hs h3{font-size:clamp(21px,2vw,25px);line-height:1.2}
.hs .script{font-family:var(--hs-script);font-weight:700;color:var(--hs-teal);letter-spacing:0}
.hs .cab-sec p,.hs .lead{font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--hs-gris);margin:14px 0 0}
.hs p{line-height:1.55}
.hs .siguiente{text-align:center;margin-top:44px}
/* buttons: coral = the main step; ghost = the second */
.hs .boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:14px 28px;border-radius:999px;font:800 16px/1 var(--hs-sans);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:transform .15s ease}
.hs .boton:hover{transform:translateY(-2px)}
.hs .boton.principal{background:var(--hs-coral);color:var(--hs-tinta);box-shadow:0 8px 20px rgba(232,100,60,.28)}
.hs .boton.fantasma{background:var(--hs-blanco);color:var(--hs-teal);box-shadow:inset 0 0 0 2px var(--hs-teal)}
/* the one card style */
.hs .tarjeta{background:var(--hs-blanco);border:1px solid var(--hs-raya);border-radius:var(--hs-radio);box-shadow:var(--hs-sombra);overflow:hidden;min-width:0}
.hs .tarjeta .cuerpo{padding:22px 24px 24px}
.hs .tarjeta .cuerpo p{margin:8px 0 0;color:var(--hs-gris);font-size:17px}
.hs .tarjeta .marco-img{background:var(--hs-arena);aspect-ratio:16/10;overflow:hidden}
.hs .tarjeta .marco-img img{width:100%;height:100%;object-fit:cover;display:block}
/* photo frames: a clean white mat; a polaroid tilt only as a small accent */
.hs .foto{background:var(--hs-blanco);padding:8px;border-radius:6px;box-shadow:var(--hs-sombra)}
.hs .foto img{display:block;width:100%;height:auto;border-radius:3px}
.hs .foto figcaption{font:700 19px/1.2 var(--hs-script);color:var(--hs-teal);text-align:center;padding:8px 4px 2px}
/* screens: laptop, tablet, phone */
.hs .portatil{position:relative}
.hs .portatil .tapa{background:#1a1d20;border-radius:14px 14px 6px 6px;padding:2.6%}
.hs .portatil .tapa img{display:block;width:100%;height:auto;border-radius:3px}
.hs .portatil .base{height:14px;margin:0 -6%;border-radius:2px 2px 14px 14px;background:linear-gradient(#e2ddd4,#b7b0a4);box-shadow:0 14px 24px rgba(0,0,0,.14)}
.hs .tableta,.hs .telefono{background:#1a1d20;border-radius:20px;padding:10px;box-shadow:0 16px 30px rgba(0,0,0,.18)}
.hs .tableta img,.hs .telefono img{display:block;width:100%;height:auto;border-radius:10px}
/* stamps + the sunburst hint behind ONE stamp (the covers' recipe; gold only) */
.hs .sello-sol{position:relative;display:inline-grid;place-items:center}
.hs .sello-sol::before{content:"";position:absolute;inset:-48%;background:url("img/ventas/sol_pista.svg") center/contain no-repeat;z-index:0;pointer-events:none}
.hs .sello-sol img{position:relative;z-index:1;display:block;width:100%;height:auto;filter:drop-shadow(0 6px 10px rgba(0,0,0,.14))}
/* small labels (pills): teal on white, a gold rule */
.hs .pastilla{display:inline-flex;align-items:center;gap:8px;background:var(--hs-blanco);border:1.5px solid var(--hs-oro);border-radius:999px;padding:6px 14px;font:700 14px/1.2 var(--hs-sans);color:var(--hs-teal)}
/* line icons, the brand style */
.hs svg.ic{width:1em;height:1em;fill:none;stroke:var(--hs-teal);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.hs .ic-circ{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--hs-oro-lav);border:1.5px solid var(--hs-oro);font-size:22px}
/* the five-color pop line: an approved thin divider (16 Oct), never stacked, never a band */
.hs .pop{height:5px;background:linear-gradient(90deg,#f6c445 0 20%,#e8643c 0 40%,#c2185b 0 60%,#0f8b8d 0 80%,#7b3fa0 0)}
@media (prefers-reduced-motion:reduce){.hs .boton{transition:none}}