/* ==========================================================================
   Alma Caleña · Postal Amarelo — shared system (Postal · Amarelo, stamp 13B)
   --------------------------------------------------------------------------
   Built from the approved boards PostalAmareloHome.dc.html (1440) and
   PostalAmareloPhone.dc.html (390), made fluid from 360 px to 1920 px.
   Tokens, type scale, layout, header, footer and every shared component.
   Nothing in this file moves: motion lives in motion.css + motion.js.

   Page agents: do not edit this file. Put page-only CSS in a <style> in the
   page and report what the shared system should gain.

   Her original photographs are shown unaltered: no filter, blend mode, tint
   or wash touches a photo <img>. Frames and crops only.
   ========================================================================== */

/* ---- Fonts: self-hosted, self-hosted production assets ------------------ */
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url("../../fonts/anton-latin.e57915c86b86.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:500;font-display:swap;src:url("../../fonts/barlow-condensed-500-latin.c67b8cf83b8c.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("../../fonts/barlow-condensed-600-latin.965395aad327.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("../../fonts/barlow-condensed-700-latin.db3da8cffd10.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 700;font-display:swap;src:url("../../fonts/archivo-latin.92895abae7c5.woff2") format("woff2")}
@font-face{font-family:"Yellowtail";font-style:normal;font-weight:400;font-display:swap;src:url("../../fonts/yellowtail-latin.90ff00fc78b8.woff2") format("woff2")}

/* ---- Tokens -------------------------------------------------------------- */
:root{
  /* proposed tenant theme (the board's) */
  --red:var(--color-primary);      /* primary */
  --deep:var(--color-secondary);     /* secondary: small red text on cream (7.1:1) */
  --gold:var(--color-accent);     /* accent: fills, never text on cream or red */
  --ink:var(--color-base-content);      /* base_content */
  --cream:var(--color-base-100);    /* base_100: the page */
  --paper:var(--color-base-200);    /* base_200: tickets, labels, stamps, postcards */
  --rule:var(--color-base-300);     /* base_300: rules and dashed cells on cream */
  --white:#ffffff;
  --muted:color-mix(in srgb,var(--ink) 85%,var(--paper));    /* small body text on paper */

  --display:"Anton","Arial Narrow",Impact,sans-serif;
  --label:"Barlow Condensed","Arial Narrow",sans-serif;
  --body:"Archivo",system-ui,sans-serif;
  --script:"Yellowtail",cursive;

  /* fluid type: linear from the phone board (390) to the desktop board (1440) */
  --fs-hero: clamp(56px, 37.5px + 7.81vw, 168px);   /* 68 → 150 */
  --fs-slab: clamp(40px, 25.8px + 5.43vw, 116px);   /* 47 → 104 */
  --fs-page: clamp(54px, 30px + 6.2vw, 136px);      /* inner-page h1 */
  --fs-h2:   clamp(46px, 41px + 3.81vw, 108px);     /* 56 → 96 */
  --fs-h2xl: clamp(80px, 77px + 3.81vw, 144px);     /* 92 → 132 (prices) */
  --fs-h3:   clamp(26px, 19.5px + 1.24vw, 42px);
  --fs-lede: clamp(17px, 16.1px + .48vw, 24px);     /* 18 → 23 */
  --fs-body: clamp(16px, 15.6px + .24vw, 19px);     /* 16.5 → 19 */
  --fs-small:clamp(14px, 13.6px + .14vw, 16px);
  --fs-label:clamp(13px, 12.3px + .25vw, 16px);     /* 14 → 16 */
  --fs-btn:  clamp(16px, 15.3px + .24vw, 19px);     /* 17 → 19 */
  --fs-nav:  clamp(15px, 9px + .55vw, 19px);

  /* layout */
  --gutter: clamp(20px, 5.5vw, 96px);               /* 21 @390 · 79 @1440 */
  --maxw: 1520px;
  --sec-y: clamp(68px, 54px + 4.2vw, 140px);        /* section padding */
  --air-h: 8px;
  --bar-h: clamp(68px, 55px + 3.4vw, 104px);
  --bar-h-stuck: clamp(62px, 54px + 1.6vw, 78px);
  --head-h: calc(var(--air-h) + var(--bar-h));
  --btn-h: clamp(50px, 47px + .6vw, 58px);
  --btn-px: clamp(20px, 17px + .8vw, 28px);

  /* motion timing tokens live here (not on body) so view-transition
     pseudo-elements can read them too; motion.css uses them */
  --ease-out: cubic-bezier(.22,.8,.24,1);
  --ease-io: cubic-bezier(.65,0,.25,1);
  --ease-back: cubic-bezier(.34,1.5,.64,1);

  --airmail: repeating-linear-gradient(-45deg,var(--red) 0 14px,var(--paper) 14px 21px,var(--gold) 21px 35px,var(--paper) 35px 42px);
  --airmail-sm: repeating-linear-gradient(-45deg,var(--red) 0 10px,var(--paper) 10px 15px,var(--gold) 15px 25px,var(--paper) 25px 30px);
  --airmail-card: repeating-linear-gradient(-45deg,var(--red) 0 18px,var(--paper) 18px 28px,var(--gold) 28px 46px,var(--paper) 46px 56px);

  /* 9-slice source of 13B's soft wavy stamp edge (page-drawn stamps) */
  --wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='97.29' height='97.29' viewBox='0 0 97.29 97.29'%3E%3Cpath d='M4.83,4.83C6.04,3.63 7.99,2.69 9.67,2.44C11.36,2.19 13.43,2.67 14.93,3.34C16.43,4.02 17.47,5.43 18.65,6.5C19.82,7.57 20.87,8.81 21.98,9.75C23.09,10.69 24.2,11.59 25.31,12.13C26.42,12.67 27.53,13 28.65,13C29.76,13 30.87,12.67 31.98,12.13C33.09,11.59 34.2,10.69 35.31,9.75C36.42,8.81 37.53,7.58 38.65,6.5C39.76,5.42 40.87,4.19 41.98,3.25C43.09,2.31 44.2,1.41 45.31,0.87C46.42,0.33 47.53,0 48.65,0C49.76,0 50.87,0.33 51.98,0.87C53.09,1.41 54.2,2.31 55.31,3.25C56.42,4.19 57.53,5.42 58.65,6.5C59.76,7.58 60.87,8.81 61.98,9.75C63.09,10.69 64.2,11.59 65.31,12.13C66.42,12.67 67.53,13 68.65,13C69.76,13 70.87,12.67 71.98,12.13C73.09,11.59 74.2,10.69 75.31,9.75C76.42,8.81 77.47,7.57 78.65,6.5C79.82,5.43 80.87,4.02 82.36,3.34C83.86,2.67 85.94,2.19 87.62,2.44C89.3,2.69 91.25,3.63 92.46,4.83C93.66,6.04 94.6,7.99 94.85,9.67C95.1,11.36 94.63,13.43 93.95,14.93C93.27,16.43 91.86,17.47 90.79,18.65C89.72,19.82 88.48,20.87 87.54,21.98C86.6,23.09 85.7,24.2 85.16,25.31C84.62,26.42 84.29,27.53 84.29,28.65C84.29,29.76 84.62,30.87 85.16,31.98C85.7,33.09 86.6,34.2 87.54,35.31C88.48,36.42 89.71,37.53 90.79,38.65C91.88,39.76 93.1,40.87 94.04,41.98C94.98,43.09 95.88,44.2 96.42,45.31C96.96,46.42 97.29,47.53 97.29,48.65C97.29,49.76 96.96,50.87 96.42,51.98C95.88,53.09 94.98,54.2 94.04,55.31C93.1,56.42 91.88,57.53 90.79,58.65C89.71,59.76 88.48,60.87 87.54,61.98C86.6,63.09 85.7,64.2 85.16,65.31C84.62,66.42 84.29,67.53 84.29,68.65C84.29,69.76 84.62,70.87 85.16,71.98C85.7,73.09 86.6,74.2 87.54,75.31C88.48,76.42 89.72,77.47 90.79,78.65C91.86,79.82 93.27,80.87 93.95,82.36C94.63,83.86 95.1,85.94 94.85,87.62C94.6,89.3 93.66,91.25 92.46,92.46C91.25,93.66 89.3,94.6 87.62,94.85C85.94,95.1 83.86,94.63 82.36,93.95C80.87,93.27 79.82,91.86 78.65,90.79C77.47,89.72 76.42,88.48 75.31,87.54C74.2,86.6 73.09,85.7 71.98,85.16C70.87,84.62 69.76,84.29 68.65,84.29C67.53,84.29 66.42,84.62 65.31,85.16C64.2,85.7 63.09,86.6 61.98,87.54C60.87,88.48 59.76,89.71 58.65,90.79C57.53,91.88 56.42,93.1 55.31,94.04C54.2,94.98 53.09,95.88 51.98,96.42C50.87,96.96 49.76,97.29 48.65,97.29C47.53,97.29 46.42,96.96 45.31,96.42C44.2,95.88 43.09,94.98 41.98,94.04C40.87,93.1 39.76,91.88 38.65,90.79C37.53,89.71 36.42,88.48 35.31,87.54C34.2,86.6 33.09,85.7 31.98,85.16C30.87,84.62 29.76,84.29 28.65,84.29C27.53,84.29 26.42,84.62 25.31,85.16C24.2,85.7 23.09,86.6 21.98,87.54C20.87,88.48 19.82,89.72 18.65,90.79C17.47,91.86 16.43,93.27 14.93,93.95C13.43,94.63 11.36,95.1 9.67,94.85C7.99,94.6 6.04,93.66 4.83,92.46C3.63,91.25 2.69,89.3 2.44,87.62C2.19,85.94 2.67,83.86 3.34,82.36C4.02,80.87 5.43,79.82 6.5,78.65C7.57,77.47 8.81,76.42 9.75,75.31C10.69,74.2 11.59,73.09 12.13,71.98C12.67,70.87 13,69.76 13,68.65C13,67.53 12.67,66.42 12.13,65.31C11.59,64.2 10.69,63.09 9.75,61.98C8.81,60.87 7.58,59.76 6.5,58.65C5.42,57.53 4.19,56.42 3.25,55.31C2.31,54.2 1.41,53.09 0.87,51.98C0.33,50.87 0,49.76 0,48.65C0,47.53 0.33,46.42 0.87,45.31C1.41,44.2 2.31,43.09 3.25,41.98C4.19,40.87 5.42,39.76 6.5,38.65C7.58,37.53 8.81,36.42 9.75,35.31C10.69,34.2 11.59,33.09 12.13,31.98C12.67,30.87 13,29.76 13,28.65C13,27.53 12.67,26.42 12.13,25.31C11.59,24.2 10.69,23.09 9.75,21.98C8.81,20.87 7.57,19.82 6.5,18.65C5.43,17.47 4.02,16.43 3.34,14.93C2.67,13.43 2.19,11.36 2.44,9.67C2.69,7.99 3.63,6.04 4.83,4.83Z'/%3E%3C/svg%3E");
  /* section top: the colour above hangs in as soft waves */
  --bite-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='16' viewBox='0 0 44 16'%3E%3Cpath d='M0,0L0,16C0.92,16 1.83,15.82 2.75,15.47C3.67,15.12 4.58,14.6 5.5,13.95C6.42,13.3 7.33,12.53 8.25,11.68C9.17,10.83 10.08,9.92 11,9C11.92,8.08 12.83,7.17 13.75,6.32C14.67,5.47 15.58,4.7 16.5,4.05C17.42,3.4 18.33,2.88 19.25,2.53C20.17,2.18 21.08,2 22,2C22.92,2 23.83,2.18 24.75,2.53C25.67,2.88 26.58,3.4 27.5,4.05C28.42,4.7 29.33,5.47 30.25,6.32C31.17,7.17 32.08,8.08 33,9C33.92,9.92 34.83,10.83 35.75,11.68C36.67,12.53 37.58,13.3 38.5,13.95C39.42,14.6 40.33,15.12 41.25,15.47C42.17,15.82 43.08,16 44,16L44,0Z'/%3E%3C/svg%3E");
}
@media (min-width:700px){:root{--air-h:10px}}
/* the next-class ticket straddles the home hero's lower edge by --t-overlap;
   --t-peek is how much of it shows above the fold on a desktop screen */
:root{--t-overlap:84px;--t-peek:150px}
@media (min-width:1100px){:root{--t-overlap:152px}}

/* ---- Base ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--air-h) + var(--bar-h-stuck) + 16px);scroll-padding-bottom:calc(64px + env(safe-area-inset-bottom))}
body{margin:0;min-height:100vh;background:var(--cream);color:var(--ink);font:500 var(--fs-body)/1.55 var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,h4,h5,p,figure,blockquote,ol,ul,dl,dd{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--focus,var(--ink));outline-offset:3px;border-radius:3px}
::selection{background:var(--gold);color:var(--ink)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
abbr[title]{text-decoration:none;cursor:help}
.skip{position:absolute;left:12px;top:-200px;z-index:200;padding:14px 18px;border-radius:999px;background:var(--ink);color:var(--paper);font:700 15px/1 var(--label);letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.skip:focus{top:12px}
.pm{pointer-events:none;overflow:visible}
.nw{white-space:nowrap}             /* keeps "19:00–21:00" and compound words whole */

/* ---- Layout -------------------------------------------------------------- */
.wrap{position:relative;width:min(100% - 2*var(--gutter), var(--maxw));margin-inline:auto}
.wrap-narrow{position:relative;width:min(100% - 2*var(--gutter), 860px);margin-inline:auto}
.wrap-mid{position:relative;width:min(100% - 2*var(--gutter), 1180px);margin-inline:auto}
:where(.alma-site,.site-head,.site-foot) .section{position:relative;padding-block:var(--sec-y);overflow-x:clip}
:where(.alma-site,.site-head,.site-foot) .section-tight{position:relative;padding-block:calc(var(--sec-y) * .6)}
.stack>*+*{margin-top:var(--stack,18px)}
.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cluster,14px 18px)}
.grid-2,.grid-3{display:grid;gap:var(--grid-gap,clamp(24px,3vw,48px));grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:640px){.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.center{text-align:center}
@media (max-width:699.98px){.hide-sm{display:none!important}}
@media (min-width:700px){.show-sm{display:none!important}}

/* ---- Surfaces ------------------------------------------------------------ */
/* --focus: the focus ring's colour on each surface, always >= 3:1 against it
   (paper on red 4.8:1, gold on ink 9:1, ink on gold 9:1, ink on cream/paper) */
.s-red{background:var(--red);color:var(--cream);--focus:var(--paper)}
.s-ink{background:var(--ink);color:var(--cream);--focus:var(--gold)}
.s-gold{background:var(--gold);color:var(--ink);--focus:var(--ink)}
.s-cream{background:var(--cream);color:var(--ink)}
.s-paper{background:var(--paper);color:var(--ink)}
.ticket-shadow,.ticket,.addr,.postal,.news-card,.stamp,.nl-event,.tip,.portrait,.postcard{--focus:var(--ink)}
/* ink texture over a red ground: under the content, never over artwork */
.inked{position:relative;isolation:isolate}
.inked::before{content:"";position:absolute;inset:0;z-index:-1;background:url("../../tenants/almacalena/ink-texture.3562ffb279ef.webp") 0 0/clamp(260px,29vw,420px);mix-blend-mode:soft-light;opacity:.2;pointer-events:none}
/* section top in 13B's soft wave: set --above to the colour of the section above */
.bite{position:absolute;left:0;right:0;top:-1px;height:16px;background:var(--above,var(--cream));-webkit-mask:var(--bite-mask) 0 0/44px 16px repeat-x;mask:var(--bite-mask) 0 0/44px 16px repeat-x;z-index:3;pointer-events:none}
.airmail{height:var(--air-h);background:var(--airmail-sm)}
@media (min-width:700px){.airmail{background:var(--airmail)}}

/* ---- Type ---------------------------------------------------------------- */
:where(.alma-site,.site-head,.site-foot) .label{font:700 var(--fs-label)/1 var(--label);letter-spacing:.18em;text-transform:uppercase}
.kick{display:flex;align-items:center;gap:.7em;color:var(--deep)}
.s-ink .kick{color:var(--gold)}
.s-red .kick{color:var(--cream)}
.s-gold .kick{color:var(--ink)}
.star{display:inline-block;width:.95em;height:.95em;flex:none;color:var(--red)}
.s-ink .star{color:var(--gold)}
.s-red .star{color:var(--cream)}
.s-gold .star{color:var(--red)}
.ic{width:1.05em;height:1.05em;flex:none;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.heart{display:inline-block;width:.8em;height:.8em;flex:none;fill:currentColor;vertical-align:-.04em}
.display{font-family:var(--display);font-weight:400;text-transform:uppercase}
.h1{font:400 var(--fs-hero)/.86 var(--display);text-transform:uppercase;letter-spacing:.004em}
.h1-page{font:400 var(--fs-page)/.88 var(--display);text-transform:uppercase;letter-spacing:.004em}
.h2{font:400 var(--fs-h2)/.92 var(--display);text-transform:uppercase}
.h2xl{font:400 var(--fs-h2xl)/.86 var(--display);text-transform:uppercase}
.h3{font:400 var(--fs-h3)/1 var(--display);text-transform:uppercase}
.kick + .h1-page,.kick + .h2,.kick + .h2xl{margin-top:clamp(14px,.75vw + 11px,22px)}
.red{color:var(--red)}
.deep{color:var(--deep)}
.gold{color:var(--gold)}
.blk{display:block;margin-top:.24em}
.script{font-family:var(--script);font-weight:400;letter-spacing:0;text-transform:none}
.sign{font:400 clamp(27px,1.38vw + 21.6px,38px)/1.15 var(--script);color:var(--deep)}
.s-ink .sign,.s-red .sign{color:var(--gold)}
.lede{font:500 var(--fs-lede)/1.45 var(--body);max-width:34em}
.txt{font:500 var(--fs-body)/1.6 var(--body);max-width:38em}
.small{font:500 var(--fs-small)/1.5 var(--body)}
.txt + .txt{margin-top:1em}

/* long-form text (About, an article's body) */
.prose{font:500 var(--fs-body)/1.65 var(--body);max-width:38em}
.prose > * + *{margin-top:1.05em}
.prose h2{margin-top:1.6em;font:400 clamp(30px,1.9vw + 22px,46px)/1 var(--display);text-transform:uppercase}
.prose h3{margin-top:1.4em;font:700 clamp(19px,.6vw + 16.5px,24px)/1.25 var(--body)}
.prose ul,.prose ol{padding-left:1.25em}
.prose li + li{margin-top:.4em}
.prose li::marker{color:var(--red)}
.prose a{color:var(--deep);text-underline-offset:3px;text-decoration-thickness:2px}
.prose strong{font-weight:700}
.prose blockquote{padding:4px 0 4px 22px;border-left:4px solid var(--gold);font-weight:600}

/* ---- Buttons and links --------------------------------------------------- */
:where(.alma-site,.site-head,.site-foot) .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--btn-h);padding:0 var(--btn-px);border:2.5px solid transparent;border-radius:999px;background:none;font:700 var(--fs-btn)/1 var(--label);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer}
:where(.alma-site,.site-head,.site-foot) .btn-gold{background:var(--gold);color:var(--ink);border-color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
:where(.alma-site,.site-head,.site-foot) .btn-gold:hover{background:#ffb020}
:where(.alma-site,.site-head,.site-foot) .btn-ink{background:var(--ink);color:var(--cream);border-color:var(--ink)}
:where(.alma-site,.site-head,.site-foot) .btn-ink:hover{background:#2c2827;border-color:#2c2827}
:where(.alma-site,.site-head,.site-foot) .btn-line{color:var(--paper);border-color:var(--paper)}
:where(.alma-site,.site-head,.site-foot) .btn-line:hover{background:rgba(255,247,236,.12)}
:where(.alma-site,.site-head,.site-foot) .btn-line-ink{color:var(--ink);border-color:var(--ink)}
:where(.alma-site,.site-head,.site-foot) .btn-line-ink:hover{background:var(--ink);color:var(--paper)}
:where(.alma-site,.site-head,.site-foot) .btn-paper{background:var(--paper);color:var(--ink);border-color:var(--ink)}
:where(.alma-site,.site-head,.site-foot) .btn-block{display:flex;width:100%}
:where(.alma-site,.site-head,.site-foot) .btn-sm{--btn-h:46px;--fs-btn:16px;--btn-px:20px}
:where(.alma-site,.site-head,.site-foot) .btn-handle{text-transform:none;letter-spacing:.03em}
:where(.alma-site,.site-head,.site-foot) .btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
/* underlined label link: "Ver a aula ↘", "Novidades no Instagram ↗" */
:where(.alma-site,.site-head,.site-foot) .link-arrow{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:700 clamp(15px,.2vw + 14.2px,17px)/1 var(--label);letter-spacing:.13em;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:2.5px;text-underline-offset:6px;white-space:nowrap}
/* body-face text link: "Fala com a Sofi para participar ↗" */
:where(.alma-site,.site-head,.site-foot) .link-txt{display:inline-flex;align-items:center;gap:5px;min-height:44px;font:600 clamp(15.5px,.15vw + 15px,17px)/1.35 var(--body);text-decoration:underline;text-underline-offset:3px}
:where(.alma-site,.site-head,.site-foot) .s-cream .link-txt,:where(.alma-site,.site-head,.site-foot) .s-paper .link-txt{color:var(--deep)}
/* a quiet "not yet" state, never a buy button: "Inscrições em breve", "Em breve" */
.soon{display:inline-flex;align-items:center;gap:12px;min-height:var(--btn-h);padding:0 22px;border:2.5px dashed currentColor;border-radius:999px;font:700 clamp(17px,.29vw + 15.9px,20px)/1 var(--label);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.soon i{position:relative;flex:none;width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(216,28,26,.22)}
.s-red .soon i,.s-ink .soon i{background:var(--gold);box-shadow:0 0 0 4px rgba(249,162,10,.25)}
.soon-sm{min-height:34px;padding:0 13px;gap:8px;border-width:2px;font-size:14px;letter-spacing:.12em}
.soon-sm i{width:8px;height:8px;box-shadow:0 0 0 3px rgba(216,28,26,.2)}

/* ---- Small pieces -------------------------------------------------------- */
.pill{display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;background:var(--ink);color:var(--gold);font:700 clamp(12.5px,.33vw + 11.2px,16px)/1 var(--label);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.tag-ink{display:inline-block;padding:6px 9px;background:var(--ink);color:var(--gold);font:700 clamp(11.5px,.14vw + 11px,13px)/1 var(--label);letter-spacing:.16em;text-transform:uppercase}
.num{display:grid;place-items:center;flex:none;width:clamp(40px,1.33vw + 34.8px,54px);aspect-ratio:1;border-radius:50%;background:var(--red);color:var(--cream);font:700 clamp(16px,.48vw + 14px,21px)/1 var(--label);letter-spacing:.04em}
.facts{display:flex;flex-direction:column;gap:12px;margin:clamp(26px,2.9vw + 15px,56px) 0 0;padding:clamp(20px,.8vw + 17px,28px) 0 0;border-top:3px solid var(--ink);list-style:none}
.facts li{display:flex;gap:12px;font:500 clamp(17px,.19vw + 16.3px,19px)/1.45 var(--body);max-width:330px}
.facts .star{margin-top:.22em}
@media (min-width:700px){.facts{flex-direction:row;flex-wrap:wrap;gap:16px 44px}}
/* breadcrumbs: full-strength text (cream on red 4.5:1); the current crumb is marked by
   weight, not by fading; links are 44 px tall tap targets */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px;font:700 13px/1.2 var(--label);letter-spacing:.16em;text-transform:uppercase}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.crumbs a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.crumbs [aria-current]{font-weight:600;letter-spacing:.14em}
.rule{height:3px;background:var(--ink);border:0;margin:0}
.dash{border:0;border-top:2px dashed rgba(20,19,19,.22);margin:0}

/* ---- Stamp edge (page-drawn stamps) --------------------------------------
   soft wavy stamp edge in 13B's language: a cosine edge with a crest at every
   corner. 9-slice mask (Chromium, WebKit); elsewhere a soft rounded stamp. */
.perf{--r:7px;padding:calc(2*var(--r));
  -webkit-mask-box-image-source:var(--wave);-webkit-mask-box-image-slice:28.65 fill;-webkit-mask-box-image-width:calc(2.865*var(--r));-webkit-mask-box-image-repeat:round;
  mask-border-source:var(--wave);mask-border-slice:28.65 fill;mask-border-width:calc(2.865*var(--r));mask-border-repeat:round}
@supports not ((-webkit-mask-box-image-source:none) or (mask-border-source:none)){.perf{border-radius:calc(2*var(--r))}}
@media (max-width:699.98px){.perf{--r:5px}}

/* ==========================================================================
   HEADER — sticky red bar under the airmail rule; condenses when scrolled
   ========================================================================== */
.site-head{position:sticky;top:0;z-index:60;background:var(--red);color:var(--paper);--focus:var(--paper);view-transition-name:site-head}
.site-head.is-stuck{box-shadow:0 10px 28px rgba(20,19,19,.22)}
.head-bar{display:flex;align-items:center;justify-content:space-between;gap:clamp(10px,1.6vw,24px);height:var(--bar-h)}
.site-head.is-stuck .head-bar{height:var(--bar-h-stuck)}
.logo{display:inline-flex;align-items:center;min-height:44px;flex:none}
.logo img{height:clamp(34px,25px + 2.3vw,58px);width:auto}
.site-head.is-stuck .logo img{height:clamp(32px,25px + 1.5vw,46px)}
.head-end{display:flex;align-items:center;gap:clamp(8px,1.2vw,22px)}
:where(.alma-site,.site-head,.site-foot) .head-end .btn{--btn-h:clamp(44px,40px + .6vw,52px);--btn-px:clamp(13px,8px + 1.1vw,24px);--fs-btn:clamp(14.5px,13px + .3vw,18px);box-shadow:3px 3px 0 var(--ink)}
.lang{display:inline-flex;border:2px solid currentColor;border-radius:999px;padding:3px;font:700 14px/1 var(--label);letter-spacing:.12em}
.lang > a{text-decoration:none;display:inline-flex;align-items:center;min-height:30px;padding:0 11px;border-radius:999px}
.lang .on{background:var(--paper);color:var(--red)}
.head-end .lang{display:none}
@media (min-width:1280px){.head-end .lang{display:inline-flex}}

/* nav: inline bar from 1200 px; a full-height red panel below that */
.nav{display:flex;align-items:center}
.nav-links{display:flex;gap:clamp(14px,1.6vw - 4px,30px);margin:0;padding:0;list-style:none;font:600 var(--fs-nav)/1 var(--label);letter-spacing:.09em;text-transform:uppercase}
.nav-links a{position:relative;display:block;padding:10px 0;text-decoration:none;white-space:nowrap}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:3px;border-radius:2px;background:var(--gold);transform:scaleX(0);transform-origin:left}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1)}
.nav-extra{display:none}
.menu-btn{display:none;position:relative;flex:none;width:44px;height:44px;padding:0;border:2px solid currentColor;border-radius:50%;background:none;color:inherit}
.menu-btn i{position:absolute;left:12px;width:16px;height:2px;border-radius:2px;background:currentColor}
.menu-btn i:nth-child(1){top:14px}
.menu-btn i:nth-child(2){top:20px}
.menu-btn i:nth-child(3){top:26px}
html.menu-open .menu-btn i:nth-child(1){top:20px;transform:rotate(45deg)}
html.menu-open .menu-btn i:nth-child(2){opacity:0}
html.menu-open .menu-btn i:nth-child(3){top:20px;transform:rotate(-45deg)}

@media (max-width:1199.98px){
  .menu-btn{display:inline-block}
  html.js .nav{position:fixed;left:0;right:0;top:var(--head-bottom,var(--head-h));height:calc(100dvh - var(--head-bottom,var(--head-h)));z-index:59;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:32px;padding:clamp(18px,4vw,40px) var(--gutter) calc(28px + env(safe-area-inset-bottom));overflow-y:auto;background:var(--red);visibility:hidden;opacity:0}
  html.js .nav::before{content:"";position:absolute;inset:0;z-index:-1;background:url("../../tenants/almacalena/ink-texture.3562ffb279ef.webp") 0 0/300px;mix-blend-mode:soft-light;opacity:.2;pointer-events:none}
  html.js.menu-open .nav{visibility:visible;opacity:1}
  html.menu-open{overflow:hidden}
  html.js .nav-links{flex-direction:column;gap:0;font:400 clamp(38px,7.5vw + 10px,64px)/1 var(--display);letter-spacing:.01em}
  html.js .nav-links a{padding:12px 0 10px;border-bottom:2px solid rgba(255,238,220,.2)}
  html.js .nav-links a::after{left:auto;right:0;bottom:50%;width:14px;height:14px;border-radius:50%;transform:translateY(50%) scale(0)}
  html.js .nav-links a[aria-current]{color:var(--gold)}
  html.js .nav-links a[aria-current]::after{transform:translateY(50%) scale(1)}
  html.js .nav-extra{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
  .nav-extra .handle{font:700 20px/1.3 var(--label);letter-spacing:.06em;color:var(--gold);text-decoration:none}
  /* without JavaScript the links simply sit under the bar */
  html:not(.js) .menu-btn{display:none}
  html:not(.js) .head-bar{flex-wrap:wrap;height:auto;padding-top:12px}
  html:not(.js) .head-end{order:2}
  html:not(.js) .nav{order:3;width:100%;padding:0 0 12px}
  html:not(.js) .nav-links{flex-wrap:wrap;gap:0 18px;font-size:15px}
}
@media (max-width:420px){:where(.alma-site,.site-head,.site-foot) .head-end .btn{--btn-px:12px;--fs-btn:14px;letter-spacing:.06em}}
@media (max-width:379.98px){
  .logo img,.site-head.is-stuck .logo img{height:32px}
  :where(.alma-site,.site-head,.site-foot) .head-end .btn{--btn-px:8px;--fs-btn:13px}
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-foot{background:var(--ink);color:var(--cream);--focus:var(--gold)}
.site-foot > .wrap{padding:clamp(52px,1.7vw + 45px,70px) 0 clamp(26px,.8vw + 23px,34px)}
.foot-call{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding-bottom:clamp(40px,1.1vw + 36px,52px)}
.foot-call h2{font:400 clamp(44px,2.9vw + 33px,84px)/.95 var(--display);text-transform:uppercase}
.foot-call p{margin-top:12px;font:400 clamp(28px,.76vw + 25px,38px)/1 var(--script);color:var(--gold)}
@media (min-width:760px){.foot-call{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:40px}}
.foot-top{display:grid;gap:22px;padding:clamp(30px,1.3vw + 25px,44px) 0;border-top:1px solid rgba(255,238,220,.18);border-bottom:1px solid rgba(255,238,220,.18)}
.foot-top .foot-logo img{width:clamp(210px,6.7vw + 184px,280px);height:auto}
.foot-nav ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0 22px;margin:0;padding:0;list-style:none;font:600 clamp(16px,.19vw + 15.3px,18px)/1 var(--label);letter-spacing:.1em;text-transform:uppercase}
.foot-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.foot-nav a:hover{color:var(--gold)}
.foot-ig{font:500 16px/1.6 var(--body)}
.foot-ig a{display:flex;align-items:center;width:fit-content;min-height:44px;font:700 clamp(19px,.19vw + 18.3px,21px)/1.3 var(--label);letter-spacing:.06em;color:var(--gold);text-decoration:none}
.foot-ig a:hover{text-decoration:underline;text-underline-offset:4px}
@media (min-width:1100px){
  .foot-top{grid-template-columns:auto 1fr auto;align-items:center;gap:56px}
  .foot-nav ul{display:flex;flex-wrap:wrap;gap:4px clamp(16px,1.5vw,28px)}
  .foot-ig{text-align:right}
  .foot-ig a{margin-left:auto}
}
/* seven links: one row from 1440 px, as on the board; below that, logo + handle on top
   and the links in a full-width row underneath, never a lone link on a second line */
@media (min-width:1100px) and (max-width:1439.98px){
  .foot-top{grid-template-columns:auto 1fr;grid-template-areas:"logo ig" "nav nav";gap:26px 56px}
  .foot-logo{grid-area:logo}.foot-ig{grid-area:ig}.foot-nav{grid-area:nav}
}
@media (min-width:1440px){.foot-top{gap:clamp(32px,2.6vw,56px)}}
.foot-bot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:26px;font:500 14px/1 var(--body);color:rgba(255,238,220,.78)}
.foot-bot .lang{border-color:rgba(255,238,220,.5);color:var(--cream)}
.foot-bot .lang .on{background:var(--cream);color:var(--ink)}

/* the prototype's own chip: the only trace of the proposal on the pages */
.proto-chip{position:fixed;left:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:90;display:inline-flex;align-items:center;gap:8px;padding:8px 13px 8px 10px;border-radius:999px;background:rgba(20,19,19,.84);color:var(--paper);font:700 11.5px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;box-shadow:0 6px 18px rgba(20,19,19,.22);opacity:.9}
/* a 44 px tap area around the small chip */
.proto-chip::after{content:"";position:absolute;inset:-11px -4px}
.proto-chip i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.proto-chip:hover,.proto-chip:focus-visible{opacity:1}
/* visible over any section: an ink ring with a gold halo */
.proto-chip:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 7px var(--gold)}
html.menu-open .proto-chip{opacity:0;pointer-events:none}
@media (max-width:699.98px){.proto-chip{left:8px;bottom:calc(8px + env(safe-area-inset-bottom));padding:6px 10px 6px 8px;font-size:10px;gap:6px;opacity:.75}}
/* desktop: parked upright in the left gutter, clear of the content */
@media (min-width:1100px){.proto-chip{left:max(6px,calc((var(--gutter) - 30px) / 2));bottom:24px;writing-mode:vertical-rl;transform:rotate(180deg);padding:12px 7px}}

/* ==========================================================================
   PAGE HERO — the red opening band of the inner pages
   <section class="page-hero s-red inked">
     <div class="wrap page-hero-top"><nav class="crumbs">…</nav></div>
     <div class="wrap page-hero-grid"> .page-hero-copy (+ optional .page-hero-art) </div>
   The breadcrumbs sit at the same height on every page; from 1000 px the hero
   fills the first screen (minus a peek of the next section) and the grid is
   centred in the space under the breadcrumbs. The section after it carries a
   .bite with --above:var(--red).
   ========================================================================== */
.page-hero{position:relative;overflow:hidden;padding:clamp(34px,4vw,72px) 0 clamp(72px,6vw + 40px,140px)}
.page-hero-top{position:relative;z-index:3}
.page-hero-grid{position:relative;z-index:2;display:grid;gap:clamp(32px,4vw,64px);align-items:center}
/* the copy column is a size container, so a headline and its ink slab fit their column */
.page-hero-copy{position:relative;z-index:2;container-type:inline-size}
/* 44 px crumb links: pulled up by the extra height so the text keeps its place */
.page-hero .crumbs{margin:-14px 0 clamp(8px,2.4vw - 14px,26px)}
.page-hero .h1-page .l1{display:block}
.page-hero .slab{margin-top:.3em;font-size:min(var(--fs-slab),15cqw)}
.page-hero .lede{margin-top:clamp(20px,1.6vw + 12px,36px);color:var(--paper)}
.page-hero .cluster{margin-top:clamp(24px,1.4vw + 18px,38px)}
@media (max-width:559.98px){:where(.alma-site,.site-head,.site-foot) .page-hero .cluster > .btn{width:100%}}
.page-hero-sun{position:absolute;z-index:0;right:calc(-1 * clamp(120px,14vw,260px));top:50%;width:clamp(320px,38vw,680px);aspect-ratio:1;border-radius:50%;background:var(--gold);transform:translateY(-50%);pointer-events:none}
.page-hero-sun::before{content:"";position:absolute;inset:-5%;border-radius:50%;border:3px solid rgba(255,238,220,.5)}
/* the art cell stretches to its column (a size-contained art inside a shrink-to-fit
   cell would collapse to 0); each art then sets its own width and alignment */
.page-hero-art{position:relative;z-index:2;justify-self:stretch;width:100%}
@media (min-width:1000px){
  .page-hero{display:flex;flex-direction:column;align-items:stretch;min-height:calc(100svh - var(--head-h) - clamp(56px,7svh,96px))}
  .page-hero > .wrap{width:min(100% - 2*var(--gutter), var(--maxw))}
  .page-hero-grid{flex:1;align-content:center;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
}
@media (max-width:999.98px){.page-hero-sun{top:auto;bottom:-22%;transform:none}}
/* the next-class ticket straddles the hero's lower edge, as on the home (aulas.html) */
.page-hero.with-ticket{padding-bottom:calc(var(--t-overlap) + clamp(30px,2.4vw,48px))}
@media (min-width:1100px){.page-hero.with-ticket{min-height:max(560px,calc(100svh - var(--head-h) + var(--t-overlap) - var(--t-peek)))}}

/* ==========================================================================
   HOME HERO — "postcard on the Cali sun"
   One composition, scaled as a unit: .hero-art is a square container sized in
   cqw, so the sun, the postcard, the 13B stamp and the postmark keep the
   board's exact geometry (the postmark's sun clip lives in the stamp's SVG).
   ========================================================================== */
.hero{position:relative;overflow:hidden;padding:clamp(22px,2.4vw + 12px,62px) 0 calc(var(--t-overlap) + clamp(28px,3vw,54px))}
.hero > .wrap{position:relative;z-index:2}
.hero-body{position:relative;z-index:4;container-type:inline-size;color:var(--cream)}
:where(.alma-site,.site-head,.site-foot) .eyebrow{display:inline-flex;align-items:center;gap:.6em;color:var(--paper);font:700 clamp(15px,.48vw + 13.1px,21px)/1 var(--label);letter-spacing:.2em;text-transform:uppercase}
:where(.alma-site,.site-head,.site-foot) .eyebrow svg{width:1.55em;height:1.55em}
.hero .h1{margin-top:clamp(20px,1vw + 16px,30px);font-size:min(var(--fs-hero),19.6cqw)}
.hero .h1 .l1{display:block;white-space:nowrap}
.slab{display:inline-block;margin-top:.35em;padding:.35em .23em .08em;background:var(--ink);color:var(--gold);font-size:min(var(--fs-slab),14.2cqw);line-height:.86;white-space:nowrap;transform:rotate(-2deg);transform-origin:left;box-shadow:.077em .077em 0 rgba(20,19,19,.22)}
/* Keep the longer English lines within their text column at every viewport. */
html:lang(en) .alma-site .hero .h1{font-size:min(var(--fs-hero),15cqw)}
html:lang(en) .alma-site .hero .h1 .slab{font-size:min(var(--fs-slab),11.8cqw)}
.hero .lede{margin-top:clamp(24px,1.6vw + 18px,42px);max-width:560px;color:var(--paper)}
.hero-cta{display:flex;flex-direction:column;gap:12px;margin-top:clamp(24px,1vw + 20px,34px)}
@media (min-width:560px){.hero-cta{flex-direction:row;flex-wrap:wrap;gap:16px}}
@media (max-width:559.98px){:where(.alma-site,.site-head,.site-foot) .hero-cta .btn{width:100%}}

.hero-art{position:relative;z-index:1;container-type:inline-size;aspect-ratio:1;width:min(118%,600px);margin:34px 0 0 -4%}
.hero-art .sun{position:absolute;inset:0;border-radius:50%;background:var(--gold)}
.hero-art .sun::before{content:"";position:absolute;inset:-5cqw;border-radius:50%;border:max(2.5px,.47cqw) solid rgba(255,238,220,.5)}
.postcard{position:relative;margin:0;padding:3.8% 3.8% 0;background:var(--paper);box-shadow:14px 18px 0 rgba(20,19,19,.2),0 22px 40px rgba(20,19,19,.25)}
.postcard .pc-img{aspect-ratio:4/5;overflow:hidden;background:var(--cream)}
.postcard .pc-img img{width:100%;height:100%;object-fit:cover}
.postcard figcaption{display:flex;align-items:center;gap:.35em;min-height:2.05em;padding:0 .14em;font:400 clamp(21px,.76vw + 18px,30px)/1 var(--script);color:var(--deep);white-space:nowrap}
.postcard figcaption .heart{width:.7em;height:.7em;color:var(--red)}
.hero-art .postcard{position:absolute;z-index:2;left:7.19cqw;top:10.63cqw;width:56.875cqw;padding:2.1875cqw 2.1875cqw 0;transform:rotate(-5deg);box-shadow:2.19cqw 2.81cqw 0 rgba(20,19,19,.2),0 3.4cqw 6.25cqw rgba(20,19,19,.25)}
.hero-art .pc-img{aspect-ratio:3/4}
.hero-art .postcard figcaption{min-height:9.375cqw;padding:0 .625cqw;gap:1.56cqw;font-size:4.53cqw}
.hero-stamp{position:absolute;z-index:3;left:51.25cqw;top:-.3125cqw;width:27.8125cqw;height:32.1875cqw;transform:rotate(8deg)}
.hero-stamp img{width:100%;height:100%;filter:drop-shadow(.78cqw 1.25cqw 0 rgba(20,19,19,.2))}
.hero-stamp svg{position:absolute;inset:0;width:100%;height:100%;color:var(--ink)}
.hero-stamp .knock{color:var(--cream)}
@media (min-width:700px) and (max-width:1099.98px){
  .hero-art{width:min(80%,620px);margin:24px calc(-1 * var(--gutter) - 4%) 0 auto}
}
@media (min-width:1100px){
  .hero{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - var(--head-h) + var(--t-overlap) - var(--t-peek))}
  .hero-body{width:59.2%}
  /* out of flow: centred on the text, bleeding right as on the board; margins in % of the wrap's width */
  .hero-art{position:absolute;left:59.2%;top:50%;width:50%;margin:-25% 0 0}
}

/* ==========================================================================
   TICKET — the next class (TeachingWeeklySlot · next_teaching_slot)
   Vertical below 1100 px, a three-part stub/body/end ticket above.
   ========================================================================== */
.ticket-zone{position:relative;z-index:6;margin-top:calc(-1 * var(--t-overlap))}
/* ink text set here, so the ticket reads the same inside a red, ink or gold section */
.ticket-shadow{color:var(--ink);filter:drop-shadow(0 20px 30px rgba(20,19,19,.27))}
.ticket{--top:92px;--end:146px;--notch:12px;display:grid;
  -webkit-mask:radial-gradient(circle var(--notch) at 0 var(--top),#0000 97%,#000),radial-gradient(circle var(--notch) at 100% var(--top),#0000 97%,#000),radial-gradient(circle var(--notch) at 0 calc(100% - var(--end)),#0000 97%,#000),radial-gradient(circle var(--notch) at 100% calc(100% - var(--end)),#0000 97%,#000);
  -webkit-mask-composite:source-in;
  mask:radial-gradient(circle var(--notch) at 0 var(--top),#0000 97%,#000),radial-gradient(circle var(--notch) at 100% var(--top),#0000 97%,#000),radial-gradient(circle var(--notch) at 0 calc(100% - var(--end)),#0000 97%,#000),radial-gradient(circle var(--notch) at 100% calc(100% - var(--end)),#0000 97%,#000);
  mask-composite:intersect}
.t-stub{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--top);padding:0 22px;background:var(--ink);color:var(--gold)}
:where(.alma-site,.site-head,.site-foot) .t-stub .label{color:var(--cream)}
.t-date{display:flex;align-items:flex-end;gap:10px}
.t-date b{font:400 clamp(70px,5.9vw + 47px,132px)/.78 var(--display)}
.t-date span{padding-bottom:3px;font:700 clamp(16px,.57vw + 13.8px,22px)/1.05 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--cream)}
.t-body{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:24px 22px 20px;background:var(--paper);border-top:2px dashed rgba(20,19,19,.25)}
.t-head{margin:0;font:400 clamp(40px,1.33vw + 38.8px,62px)/.95 var(--display);text-transform:uppercase}
.t-head b{display:block;font-weight:400}
.t-head .t-time{color:var(--red);margin-top:4px}
.t-main .t-meta{margin-top:clamp(14px,.4vw + 12.5px,18px)}
.t-meta{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;font:600 clamp(16px,.19vw + 15.3px,18px)/1.35 var(--body)}
.t-meta li{display:grid;grid-template-columns:46px 1fr;align-items:baseline;padding:3px 0}
:where(.alma-site,.site-head,.site-foot) .t-meta .label{font-size:13px;color:var(--deep)}
.t-note{display:flex;align-items:flex-start;gap:10px;padding-top:14px;border-top:2px dashed rgba(20,19,19,.2);font:500 clamp(15px,.1vw + 14.6px,16px)/1.4 var(--body)}
.t-note i{flex:none;width:24px;height:24px;margin-top:-1px;border-radius:50%;background:var(--red);color:var(--cream);font:700 14px/24px var(--body);font-style:normal;text-align:center}
.t-end{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:var(--end);padding:0 22px;background:var(--gold);border-top:3px dotted rgba(20,19,19,.45)}
:where(.alma-site,.site-head,.site-foot) .t-end .btn{--btn-h:clamp(54px,.6vw + 52px,62px);width:100%;max-width:320px}
:where(.alma-site,.site-head,.site-foot) .t-end .link-arrow{border:0}
@media (min-width:600px) and (max-width:1099.98px){.ticket-shadow{max-width:620px}}
@media (min-width:1100px){
  .ticket{--stub:clamp(210px,15.8vw,270px);--end:clamp(280px,22.2vw,350px);--notch:17px;grid-template-columns:var(--stub) minmax(0,1fr) var(--end);min-height:236px;
    -webkit-mask:radial-gradient(circle var(--notch) at var(--stub) 0,#0000 97%,#000),radial-gradient(circle var(--notch) at var(--stub) 100%,#0000 97%,#000),radial-gradient(circle var(--notch) at calc(100% - var(--end)) 0,#0000 97%,#000),radial-gradient(circle var(--notch) at calc(100% - var(--end)) 100%,#0000 97%,#000);
    -webkit-mask-composite:source-in;
    mask:radial-gradient(circle var(--notch) at var(--stub) 0,#0000 97%,#000),radial-gradient(circle var(--notch) at var(--stub) 100%,#0000 97%,#000),radial-gradient(circle var(--notch) at calc(100% - var(--end)) 0,#0000 97%,#000),radial-gradient(circle var(--notch) at calc(100% - var(--end)) 100%,#0000 97%,#000);
    mask-composite:intersect}
  .t-stub{flex-direction:column;align-items:flex-start;justify-content:space-between;height:auto;padding:30px 28px 26px}
  .t-body{padding:30px 40px 24px 46px;border-top:0;background-image:radial-gradient(circle 3px,rgba(20,19,19,.35) 96%,#0000);background-size:3px 14px;background-repeat:repeat-y}
  .t-head{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.38em}
  .t-head .t-time{margin-top:0}
  .t-meta{flex-direction:row;gap:34px}
  .t-meta li{display:flex;gap:10px;padding:0}
  .t-note{align-items:center;padding-top:16px}
  .t-end{height:auto;gap:18px;padding:20px 24px;border-top:0;border-left:3px dotted rgba(20,19,19,.45)}
}

/* ==========================================================================
   THE WEEK (TeachingWeeklySlot · teaching_week) + venue card
   ========================================================================== */
.week{display:flex;gap:clamp(5px,.9vw - 1px,12px);margin-top:clamp(36px,1.9vw + 29px,56px)}
.day{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;justify-content:space-between;min-height:clamp(96px,6.1vw + 72px,164px);padding:clamp(10px,.6vw + 8px,16px) 2px;border:clamp(1.5px,.05vw + 1.3px,2px) dashed rgba(20,19,19,.24);border-radius:4px;color:rgba(20,19,19,.64)}
.day .day-n{font:700 clamp(14px,.57vw + 11.8px,20px)/1 var(--label);letter-spacing:clamp(.06em,.1vw,.14em)}
.day span{font:500 clamp(16px,.57vw + 13.8px,22px)/1 var(--label)}
.day-on{position:relative;padding:0;border:0;color:var(--paper)}
.day-on .perf{position:absolute;inset:clamp(-14px,-.48vw - 7px,-9px) clamp(-12px,-.57vw - 3.8px,-6px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(4px,.2vw + 3px,6px);background:var(--red);color:var(--paper);text-align:center;transform:rotate(-3deg)}
.day-on .perf::before{content:"";position:absolute;inset:clamp(8px,.4vw + 6.5px,12px);border:clamp(1.5px,.05vw + 1.3px,2px) solid var(--cream);border-radius:4px;pointer-events:none}
.day-on .day-n{color:var(--cream);font:400 clamp(23px,1.62vw + 16.7px,40px)/1 var(--display);letter-spacing:.02em}
.day-on .day-s{font:600 clamp(13px,.29vw + 12px,16px)/1.15 var(--label);letter-spacing:.04em}
.day-on .day-t{font:700 clamp(11.5px,.52vw + 9.5px,17px)/1.1 var(--label)}
.day-pm{position:absolute;z-index:2;left:66%;top:46%;width:clamp(64px,4.6vw + 46px,112px);color:var(--ink);opacity:.88;transform:rotate(12deg)}
@media (min-width:700px){.day-pm{left:calc(100% - 4px);top:35%}}
@media (max-width:699.98px){.day-on .day-s{display:none}}
.week-cap{margin-top:22px;font:600 15px/1.4 var(--body)}
.week-cap b{color:var(--red)}

.addr{position:relative;margin-top:clamp(28px,4vw,60px);background:var(--paper);border:clamp(2.5px,.05vw + 2.3px,3px) solid var(--ink);box-shadow:clamp(8px,.4vw + 6.5px,12px) clamp(8px,.4vw + 6.5px,12px) 0 var(--ink);transform:rotate(1.2deg)}
.addr-head{padding:clamp(18px,.4vw + 16.5px,22px) clamp(20px,.6vw + 17.7px,26px) clamp(16px,.4vw + 14.5px,20px);background:var(--ink);color:var(--cream)}
.addr-head h2,.addr-head h3{font:400 clamp(34px,.76vw + 31px,44px)/1 var(--display);text-transform:uppercase}
:where(.alma-site,.site-head,.site-foot) .addr-head .label{display:block;margin-top:9px;color:var(--gold);font-size:clamp(13px,.19vw + 12.3px,15px)}
.addr-body{padding:clamp(6px,.6vw + 3.8px,12px) clamp(20px,.6vw + 17.7px,26px) clamp(22px,.6vw + 19.7px,28px)}
.addr-row{display:grid;grid-template-columns:clamp(72px,1.3vw + 67px,86px) 1fr;align-items:baseline;gap:10px;padding:clamp(13px,.3vw + 12px,16px) 0 clamp(10px,.2vw + 9.3px,12px);border-bottom:2px solid rgba(20,19,19,.14)}
:where(.alma-site,.site-head,.site-foot) .addr-row .label{font-size:clamp(12.5px,.14vw + 12px,14px);color:var(--deep)}
.addr-row b{font:700 clamp(17px,.38vw + 15.5px,21px)/1.3 var(--body)}
.addr-row b.big{font:400 clamp(28px,.76vw + 25px,36px)/1 var(--display);text-transform:uppercase}
.addr-warn{margin-top:clamp(18px,.4vw + 16.5px,22px);padding:clamp(13px,.3vw + 12px,16px) clamp(15px,.3vw + 14px,18px);background:var(--red);color:var(--paper);font:600 clamp(17px,.19vw + 16.3px,19px)/1.3 var(--label);letter-spacing:.02em}
.addr-warn b{display:block;font-size:clamp(19px,.29vw + 17.9px,22px)}
.addr-act{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;margin-top:clamp(18px,.6vw + 15.7px,24px)}
:where(.alma-site,.site-head,.site-foot) .addr-act .btn{--btn-h:50px;--fs-btn:17px;--btn-px:22px}
:where(.alma-site,.site-head,.site-foot) .addr-act .link-txt{flex-basis:100%}

/* week + venue side by side (home "Aulas", aulas.html) */
.aulas-grid{display:grid;gap:0;align-items:start}
.aulas-grid .addr{width:min(100%,520px)}
@media (min-width:1100px){.aulas-grid{grid-template-columns:minmax(0,1fr) clamp(400px,31.4vw,480px);gap:clamp(56px,6vw,96px)}.aulas-grid .addr{width:auto}}

/* ==========================================================================
   STAMP SHEET — prices (products pending; never a buy button)
   ========================================================================== */
.precos-head{display:grid;gap:18px;align-items:end}
.precos-head .lede{color:var(--cream)}
@media (max-width:899.98px){.precos-head{gap:clamp(30px,2vw + 22px,40px)}}
@media (min-width:900px){.precos-head{grid-template-columns:minmax(0,1fr) minmax(300px,420px);gap:60px}.precos-head .lede{margin-bottom:12px}}
.precos-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:clamp(56px,3vw + 44px,88px);font:500 clamp(16px,.19vw + 15.3px,18px)/1.5 var(--body)}
:where(.alma-site,.site-head,.site-foot) .s-ink .precos-note .link-txt{color:var(--cream)}
.sheet{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:26px;width:min(100%,440px);margin:clamp(48px,3.4vw + 35px,84px) auto 0}
.st-wrap{position:relative;z-index:1}
/* soft shadow drawn behind each stamp, so no filter touches the artwork */
.st-wrap::before{content:"";position:absolute;inset:6px 4px 0;z-index:-1;border-radius:22px;background:rgba(0,0,0,.42);transform:translateY(16px);filter:blur(11px)}
.sheet > .st-wrap:nth-child(1){transform:rotate(-1.5deg)}
.sheet > .st-wrap:nth-child(2){transform:rotate(.9deg)}
.sheet > .st-wrap:nth-child(3){transform:rotate(-.6deg)}
.stamp{--r:12px;height:100%;margin:0;background:var(--paper);color:var(--ink)}
@media (max-width:699.98px){.stamp{--r:9px}}
.stamp-in{display:flex;flex-direction:column;height:100%;padding:clamp(11px,.3vw + 10px,14px);border:clamp(2px,.05vw + 1.8px,2.5px) solid var(--ink);border-radius:8px}
.stamp-img{position:relative;flex-shrink:0;height:clamp(176px,8.2vw + 144px,268px);overflow:hidden;border-radius:3px;background:var(--cream)}
.stamp-img img{width:100%;height:100%;object-fit:cover}
.stamp-img img.photo-community{object-fit:contain;background:var(--cream)}
.stamp-cap{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:clamp(14px,.4vw + 12.5px,18px);padding:clamp(16px,.4vw + 14.5px,20px) 4px 4px}
.stamp-cap .val{font:400 clamp(74px,1.71vw + 67px,92px)/.8 var(--display);color:var(--red);letter-spacing:-.01em;white-space:nowrap}
.stamp-cap .val sup{margin-left:3px;font-size:.42em;vertical-align:.95em}
.stamp-cap h3{margin:0 0 4px;font:400 clamp(25px,.48vw + 23px,30px)/1 var(--display);text-transform:uppercase}
.stamp-cap p{margin-top:6px;font:500 clamp(14px,.14vw + 13.5px,15.5px)/1.4 var(--body);color:var(--muted)}
.stamp-type{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--red);color:var(--paper)}
.stamp-type::before{content:"";position:absolute;inset:clamp(9px,.3vw + 8px,12px);border:clamp(2.5px,.05vw + 2.3px,3px) solid var(--paper);border-radius:6px}
.stamp-type::after{content:"";position:absolute;inset:0;background:url("../../tenants/almacalena/ink-texture.3562ffb279ef.webp") 0 0/300px;mix-blend-mode:soft-light;opacity:.22}
.stamp-type .ty-day{font:400 clamp(92px,3.8vw + 77px,132px)/.8 var(--display);letter-spacing:.01em}
.stamp-type .ty-time{font:700 clamp(17px,.48vw + 15px,22px)/1 var(--label);letter-spacing:.16em}
.stamp-type svg{width:clamp(112px,3.6vw + 98px,150px);height:auto;color:var(--paper)}
.stamp-tag{position:absolute;left:clamp(9px,.3vw + 8px,12px);bottom:clamp(9px,.3vw + 8px,12px);padding:6px 9px;background:var(--ink);color:var(--gold);font:700 clamp(11.5px,.14vw + 11px,13px)/1 var(--label);letter-spacing:.16em;text-transform:uppercase}
.stamp-soon{display:flex;align-items:center;gap:8px;margin:12px 4px 2px;padding-top:12px;border-top:2px dashed rgba(20,19,19,.2);font:700 13px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--deep)}
.stamp-soon i{position:relative;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px rgba(216,28,26,.2)}
.sheet-pm{position:absolute;z-index:3;left:44%;top:-44px;width:clamp(300px,15.2vw + 240px,480px);color:var(--gold);transform-origin:14% 45%;transform:rotate(-5deg)}
/* tablets: two stamps side by side, the third centred under them */
@media (min-width:600px) and (max-width:859.98px){
  .sheet{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .sheet > .st-wrap:nth-child(3){grid-column:1/-1;justify-self:center;width:calc(50% - 13px)}
  .sheet-pm{left:30%}
}
@media (min-width:860px){
  .sheet{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,2.4vw,40px);width:100%}
  .sheet > .st-wrap:nth-child(2){transform:rotate(.8deg) translateY(18px)}
  .sheet-pm{left:27.5%;top:-70px}
}

/* ==========================================================================
   POSTER — the workshop (one Event, pending)
   ========================================================================== */
.ws-top{position:relative;display:flex;flex-direction:column;gap:8px;padding-bottom:14px;border-bottom:clamp(3px,.1vw + 2.6px,4px) solid var(--ink)}
:where(.alma-site,.site-head,.site-foot) .ws-top .label{font-size:clamp(13.5px,.43vw + 11.8px,18px)}
@media (min-width:700px){.ws-top{flex-direction:row;justify-content:space-between;align-items:center;padding-bottom:18px}}
.ws-head{position:relative;display:flex;align-items:flex-start;gap:clamp(20px,3vw,48px)}
.ws-title{margin-top:clamp(16px,1.15vw + 11.5px,28px);font:400 clamp(66px,43px + 7.43vw,168px)/.8 var(--display);text-transform:uppercase;letter-spacing:-.005em;white-space:nowrap}
#workshop .ws-title{margin-bottom:clamp(24px,2vw,32px)}
.ws-sticker{display:grid;place-items:center;flex:none;width:clamp(96px,6.1vw + 72px,164px);aspect-ratio:1;margin:0;border:clamp(2px,.1vw + 1.6px,3px) solid var(--ink);border-radius:50%;background:var(--red);color:var(--cream);text-align:center;transform:rotate(12deg);box-shadow:clamp(3px,.3vw + 2px,6px) clamp(3px,.3vw + 2px,6px) 0 var(--ink)}
.ws-sticker .ws-st{display:block;font:700 clamp(10px,.48vw + 8px,15px)/1.1 var(--label);letter-spacing:.14em;text-transform:uppercase}
.ws-sticker b{display:block;font:400 clamp(30px,2.1vw + 22px,52px)/.9 var(--display);letter-spacing:.01em}
.ws-sticker .ord{margin-left:1px;font:700 .42em/1 var(--label);text-decoration:underline;text-decoration-thickness:.12em;text-underline-offset:.1em;vertical-align:1.1em}
@media (max-width:699.98px){
  .ws-head{display:block}
  .ws-head .ws-sticker{position:absolute;right:-4px;top:-104px}
}
.ws-facts{display:grid;margin-top:clamp(22px,1.3vw + 17px,36px);border-top:clamp(3px,.1vw + 2.6px,4px) solid var(--ink)}
.ws-fact{padding:16px 0;border-bottom:clamp(3px,.1vw + 2.6px,4px) solid var(--ink)}
:where(.alma-site,.site-head,.site-foot) .ws-fact .label{font-size:clamp(13px,.19vw + 12.3px,15px)}
.ws-fact b{display:block;margin-top:clamp(8px,.4vw + 6.5px,12px);font:400 clamp(40px,1.52vw + 34px,58px)/.92 var(--display);text-transform:uppercase}
/* three columns from 1000 px: capped so "21 de novembro" and "Stage Center" stay on one line */
@media (min-width:1000px){.ws-fact b{font-size:clamp(38px,min(1.52vw + 34px,4.2vw),58px)}}
.ws-fact small{display:block;margin-top:clamp(7px,.3vw + 6px,10px);font:600 clamp(16px,.19vw + 15.3px,18px)/1.3 var(--body)}
@media (min-width:1000px){
  .ws-facts{grid-template-columns:1.1fr 1fr 1fr;border-bottom:clamp(3px,.1vw + 2.6px,4px) solid var(--ink)}
  .ws-fact{padding:clamp(20px,1vw,26px) clamp(16px,2vw,28px) clamp(20px,1vw,26px) 0;border-bottom:0}
  .ws-fact + .ws-fact{padding-left:clamp(16px,2vw,28px);border-left:clamp(3px,.1vw + 2.6px,4px) solid var(--ink)}
}
.ws-main{display:grid;gap:44px;margin-top:clamp(40px,1.5vw + 34px,56px);align-items:start}
@media (min-width:1100px){.ws-main{grid-template-columns:minmax(0,1fr) clamp(400px,32vw,500px);gap:70px}}
.prog h3{margin-bottom:6px;font:700 clamp(15px,.29vw + 14px,18px)/1 var(--label);letter-spacing:.2em;text-transform:uppercase}
.prog ol{margin:0;padding:0;list-style:none}
.prog li{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 14px;padding:clamp(14px,.6vw + 11.7px,20px) 0;border-bottom:3px solid var(--ink)}
.prog li .num{grid-row:span 2}
.prog li b{font:400 clamp(30px,1.9vw + 22.6px,52px)/1 var(--display);text-transform:uppercase}
.prog li .pill{justify-self:start}
@media (min-width:700px){
  .prog li{grid-template-columns:auto 1fr auto;gap:20px}
  .prog li .num{grid-row:auto}
}
.ws-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:clamp(32px,.8vw + 29px,40px)}
.ws-party{margin-top:clamp(22px,.6vw + 19.7px,28px);font:500 clamp(16px,.19vw + 15.3px,18px)/1.45 var(--body)}
.guest{position:relative;padding:clamp(24px,1.1vw + 20px,36px) clamp(22px,1.1vw + 18px,36px) clamp(28px,1vw + 24px,38px);background:var(--ink);color:var(--cream);transform:rotate(1.4deg);box-shadow:clamp(7px,.3vw + 6px,10px) clamp(7px,.3vw + 6px,10px) 0 var(--red);max-width:540px}
:where(.alma-site,.site-head,.site-foot) .guest .label{color:var(--gold);font-size:clamp(13px,.19vw + 12.3px,15px)}
.guest h3{margin-top:clamp(12px,.6vw + 9.7px,18px);font:400 clamp(80px,3.8vw + 65px,124px)/.8 var(--display);color:var(--gold);text-transform:uppercase}
.guest .from{margin-top:clamp(12px,.4vw + 10.5px,16px);font:600 clamp(21px,.48vw + 19px,26px)/1.1 var(--label);letter-spacing:.06em;text-transform:uppercase}
.guest .bio{max-width:260px;margin-top:clamp(14px,.4vw + 12.5px,18px);padding-top:clamp(14px,.4vw + 12.5px,18px);border-top:2px solid rgba(255,238,220,.25);font:500 clamp(16px,.19vw + 15.3px,18px)/1.5 var(--body)}

/* ==========================================================================
   POSTAL — the back of a postcard (About teaser), + photo postcard + portrait
   ========================================================================== */
.postal{position:relative;display:grid;background:var(--paper);border:clamp(11px,.48vw + 9px,16px) solid;border-image:var(--airmail-card) 16;box-shadow:0 30px 60px rgba(20,19,19,.14)}
.postal-msg{padding:clamp(30px,2.7vw + 19.5px,58px) clamp(22px,4vw + 6.5px,64px) clamp(32px,2.7vw + 21.5px,60px)}
.postal-msg .h2{font-size:clamp(56px,4.6vw + 38px,108px)}
.postal-msg .txt{margin-top:clamp(18px,.76vw + 15px,26px);max-width:600px}
.postal-msg .sign{margin-top:clamp(22px,.76vw + 19px,30px)}
:where(.alma-site,.site-head,.site-foot) .postal-msg .btn{margin-top:clamp(26px,.76vw + 23px,34px)}
.postal-div{position:relative;height:2px;margin:0 clamp(22px,2vw,40px);background:rgba(20,19,19,.22)}
.postal-div span{position:absolute;left:50%;top:50%;padding:0 12px;background:var(--paper);color:rgba(20,19,19,.6);font:700 clamp(11px,.19vw + 10.3px,13px)/1 var(--label);letter-spacing:.28em;text-transform:uppercase;white-space:nowrap;transform:translate(-50%,-50%)}
.postal-addr{position:relative;padding:clamp(36px,1.1vw + 32px,48px) clamp(22px,2.9vw + 11px,52px) clamp(28px,2.3vw + 19px,52px)}
@media (min-width:1000px){
  .postal{grid-template-columns:minmax(0,1fr) 2px clamp(400px,33vw,500px)}
  .postal-div{height:auto;margin:0}
  .postal-div span{transform:translate(-50%,-50%) rotate(-90deg)}
}
.portrait-wrap{position:relative;width:clamp(178px,6.9vw + 151px,256px);margin-left:auto;margin-right:6px;transform:rotate(4deg)}
/* flat wavy shade under a photo or word stamp: a masked copy of its outline, so no
   filter ever touches the artwork. On the wrapper of any .perf stamp; set --shade-r
   to the stamp's --r and --shade-x / --shade-y for the offset. */
.portrait-wrap,.perf-shade{position:relative;isolation:isolate}
:is(.portrait-wrap,.perf-shade)::before{content:"";position:absolute;inset:0;z-index:-1;transform:translate(var(--shade-x,5px),var(--shade-y,8px));background:rgba(20,19,19,var(--shade-a,.2));--r:var(--shade-r,7px);-webkit-mask-box-image-source:var(--wave);-webkit-mask-box-image-slice:28.65 fill;-webkit-mask-box-image-width:calc(2.865*var(--r));-webkit-mask-box-image-repeat:round;mask-border-source:var(--wave);mask-border-slice:28.65 fill;mask-border-width:calc(2.865*var(--r));mask-border-repeat:round}
@media (max-width:699.98px){.portrait-wrap{--shade-r:5px}}
.portrait{margin:0;background:var(--white);color:var(--ink)}
.portrait img{width:100%;aspect-ratio:250/290;height:auto;object-fit:cover;object-position:50% 18%}
.portrait figcaption{display:flex;justify-content:space-between;padding:10px 2px 0;font:700 clamp(11px,.19vw + 10.3px,13px)/1 var(--label);letter-spacing:.16em;text-transform:uppercase}
.portrait-pm{position:absolute;z-index:2;left:clamp(6px,-6vw + 30px,-64px);top:clamp(6px,.6vw,14px);width:clamp(210px,8.6vw + 176px,300px);color:var(--ink);opacity:.85;transform:rotate(-6deg)}
.lines{margin-top:clamp(30px,2.7vw + 19.5px,58px)}
.lines p{padding:10px 4px 7px;border-bottom:2px solid rgba(20,19,19,.26);font:400 clamp(30px,.76vw + 27px,38px)/1.1 var(--script);color:var(--ink)}
.lines p.sm{font-size:clamp(24px,.57vw + 21.8px,30px)}

/* ==========================================================================
   COMMUNITY CALL — closing band on red
   ========================================================================== */
.call-grid{position:relative;z-index:2;display:grid;gap:38px;align-items:end}
@media (min-width:900px){.call-grid{grid-template-columns:minmax(0,1fr) 340px;gap:80px}}
.call-grid .h2{margin-top:16px;font-size:clamp(56px,4.6vw + 38px,108px);line-height:1.2}
.call-grid .script{margin-top:clamp(18px,.76vw + 15px,26px);font-size:clamp(33px,1.05vw + 29px,46px);line-height:1;transform:rotate(-3deg);transform-origin:left}
.call-side{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(12px,1vw + 8px,22px);padding-bottom:12px}
.call-side p{font:500 clamp(17px,.19vw + 16.3px,19px)/1.5 var(--body);color:var(--paper)}
:where(.alma-site,.site-head,.site-foot) .call-side .link-txt{color:var(--paper)}

/* ==========================================================================
   NEWS — newsletter discovery (Issue: subject, lede, date, optional masthead)
   .news-card on the home and lists; .pm-date is the date drawn as a postmark.
   ========================================================================== */
.news-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px 40px}
.news-head .lede{margin-top:16px}
.news-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(26px,2.4vw,40px);margin-top:clamp(40px,3vw + 28px,76px)}
@media (min-width:700px){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.news-grid .news-card--lead{grid-column:1/-1}}
@media (min-width:1100px){
  .news-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
  .news-grid .news-card--lead{grid-column:1;grid-row:span 2}
  /* the lead's masthead takes the height the stacked pair leaves (a taller crop, never a stretch) */
  .news-grid .news-card--lead .news-img{flex:1 1 auto;aspect-ratio:auto;min-height:clamp(200px,17vw,300px)}
  .news-grid .news-card--lead .news-img img{position:absolute;inset:0}
  .news-grid .news-card--lead .news-body{flex:0 0 auto}
}
.news-card{--tilt:0deg;position:relative;display:flex;flex-direction:column;background:var(--paper);border:clamp(8px,.2vw + 7px,10px) solid;border-image:var(--airmail-sm) 10;box-shadow:0 18px 36px rgba(20,19,19,.13);transform:rotate(var(--tilt))}
.news-grid .news-card:nth-child(1){--tilt:-.7deg}
.news-grid .news-card:nth-child(2){--tilt:.6deg}
.news-grid .news-card:nth-child(3){--tilt:-.4deg}
.news-img{position:relative;aspect-ratio:3/1;overflow:hidden;background:var(--cream);border-bottom:2px solid var(--ink)}
.news-img img{width:100%;height:100%;object-fit:cover}
.news-body{position:relative;display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:clamp(12px,.6vw + 10px,18px);padding:clamp(20px,1.2vw + 15px,34px) clamp(20px,1.3vw + 15px,36px) clamp(22px,1.2vw + 17px,34px)}
/* leading 1.12: Anton's accents (Ñ, Ó, Ã) on a wrapped line must clear the line above */
.news-title{font:400 clamp(28px,1.15vw + 23.5px,42px)/1.12 var(--display);text-transform:uppercase;text-wrap:balance}
.news-card--lead .news-title{font-size:clamp(32px,1.9vw + 24.6px,58px)}
.news-title a{text-decoration:none}
.news-title a::after{content:"";position:absolute;inset:0;z-index:1}
.news-title a:focus-visible{outline:0}
.news-card:has(.news-title a:focus-visible){outline:3px solid var(--ink);outline-offset:6px}
.news-lede{font:500 clamp(15.5px,.24vw + 14.6px,18px)/1.55 var(--body);color:var(--muted);max-width:34em}
.news-more{position:relative;z-index:2;margin-top:auto;color:var(--deep)}
/* the date as a postmark: ring, day, month, year, cancel waves */
.pm-date{--pm-gap:var(--paper);position:relative;display:inline-flex;align-items:center;gap:0;color:var(--ink)}
.pm-date .ring{display:grid;place-items:center;align-content:center;width:clamp(70px,1.3vw + 65px,86px);aspect-ratio:1;border:3px solid currentColor;border-radius:50%;box-shadow:inset 0 0 0 4px var(--pm-gap),inset 0 0 0 5.5px currentColor;text-align:center;transform:rotate(-9deg);line-height:1}
.pm-date .d{display:block;font:400 clamp(26px,.6vw + 23.6px,32px)/.9 var(--display)}
.pm-date .m{display:block;margin-top:2px;font:700 clamp(11px,.15vw + 10.4px,12.5px)/1 var(--label);letter-spacing:.16em;text-transform:uppercase}
.pm-date .y{display:block;margin-top:2px;font:600 10px/1 var(--label);letter-spacing:.18em;opacity:.8}
.pm-date svg{width:clamp(90px,3vw + 78px,120px);height:auto;aspect-ratio:124/52;margin-left:-4px;opacity:.85}
/* gold on ink only: gold on red is 2.5:1, so a postmark on red is paper */
.s-ink .pm-date{color:var(--gold);--pm-gap:var(--ink)}
.s-red .pm-date{color:var(--paper);--pm-gap:var(--red)}
/* archive rows (novidades.html): postmark | text | optional masthead */
.news-list{margin:0;padding:0;list-style:none;border-top:3px solid var(--ink)}
.news-row{position:relative;display:grid;gap:18px;padding:clamp(26px,1.5vw + 20px,40px) 0;border-bottom:2px dashed rgba(20,19,19,.25)}
.news-row .news-title{font-size:clamp(30px,1.5vw + 24px,50px)}
@media (min-width:800px){
  .news-row{grid-template-columns:clamp(150px,13vw,210px) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:start}
  .news-row.has-img{grid-template-columns:clamp(150px,13vw,210px) minmax(0,1fr) clamp(220px,22vw,360px)}
}
.news-row .news-img{border:2px solid var(--ink)}
.pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:24px;font:700 15px/1 var(--label);letter-spacing:.12em;text-transform:uppercase}

/* an article page (newsletter:issue) */
.article-head{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(16px,1vw + 12px,26px)}
.article-title{font:400 clamp(44px,3.6vw + 30px,104px)/.92 var(--display);text-transform:uppercase;text-wrap:balance}
.article-masthead{margin-top:clamp(30px,2vw + 22px,56px);border:clamp(8px,.2vw + 7px,10px) solid;border-image:var(--airmail-sm) 10;background:var(--paper)}
.article-masthead img{width:100%;aspect-ratio:3/1;object-fit:cover}
/* newsletter blocks inside an issue body: text, event, schedule */
.nl-block{margin-top:clamp(26px,1.2vw + 21px,40px)}
.nl-event{display:grid;gap:14px;padding:clamp(20px,1.2vw + 15px,30px);background:var(--paper);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.nl-event .h3{font-size:clamp(28px,1.1vw + 24px,40px);line-height:1.12}
.nl-event dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font:600 clamp(16px,.19vw + 15.3px,18px)/1.35 var(--body)}
.nl-event dt{font:700 13px/1.6 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--deep)}
.nl-schedule{padding:clamp(20px,1.2vw + 15px,30px);background:var(--ink);color:var(--cream)}
:where(.alma-site,.site-head,.site-foot) .nl-schedule .label{color:var(--gold)}
.share{display:grid;gap:14px;padding-top:24px;border-top:2px dashed rgba(20,19,19,.25)}

/* ==========================================================================
   FORMS — drawn as the platform's frozen form pieces (visual only)
   leads/_newsletter_form.html · leads/_contact_form.html · events/_signup_form.html
   ========================================================================== */
:where(.alma-site,.site-head,.site-foot) .form{display:flex;flex-direction:column;gap:18px}
.field{display:flex;flex-direction:column;gap:8px}
.field-label{font:700 14px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--deep)}
.s-ink .field-label{color:var(--gold)}
.s-red .field-label{color:var(--paper)}
:where(.alma-site,.site-head,.site-foot) .input,:where(.alma-site,.site-head,.site-foot) .textarea,:where(.alma-site,.site-head,.site-foot) .select{width:100%;min-height:54px;padding:12px 16px;border:2.5px solid var(--ink);border-radius:12px;background:var(--paper);color:var(--ink);font:500 17px/1.35 var(--body);box-shadow:inset 0 2px 0 rgba(20,19,19,.06)}
:where(.alma-site,.site-head,.site-foot) .textarea{min-height:150px;resize:vertical}
:where(.alma-site,.site-head,.site-foot) .select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
:where(.alma-site,.site-head,.site-foot) .input::placeholder,:where(.alma-site,.site-head,.site-foot) .textarea::placeholder{color:rgba(20,19,19,.45)}
/* the ring follows the surface: ink on paper, paper on red, gold on ink */
:where(.alma-site,.site-head,.site-foot) .input:focus-visible,:where(.alma-site,.site-head,.site-foot) .textarea:focus-visible,:where(.alma-site,.site-head,.site-foot) .select:focus-visible{outline:3px solid var(--focus,var(--ink));outline-offset:2px}
:where(.alma-site,.site-head,.site-foot) .form-row{display:flex;flex-direction:column;gap:12px}
@media (min-width:640px){:where(.alma-site,.site-head,.site-foot) .form-row{flex-direction:row;align-items:flex-end}:where(.alma-site,.site-head,.site-foot) .form-row > .field{flex:1}}
.check{display:flex;align-items:flex-start;gap:12px;font:500 15px/1.45 var(--body)}
.check input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--red)}
:where(.alma-site,.site-head,.site-foot) .form-help{font:500 14px/1.45 var(--body);opacity:.78}
:where(.alma-site,.site-head,.site-foot) .form-note{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border:2px dashed currentColor;border-radius:12px;font:600 15px/1.45 var(--body)}
.hp{display:none!important}
.signup{display:grid;gap:clamp(24px,3vw,56px);align-items:start}
@media (min-width:900px){.signup{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}}

/* ==========================================================================
   DETAILS — a question that opens (FAQ-like blocks on aulas / localização)
   ========================================================================== */
.qa{border-top:3px solid var(--ink)}
.qa details{border-bottom:2px solid rgba(20,19,19,.18)}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:16px 0;cursor:pointer;list-style:none;font:400 clamp(22px,.76vw + 19px,30px)/1.05 var(--display);text-transform:uppercase}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 6v12M6 12h12' stroke='%23fff7ec' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E") center/18px no-repeat}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa .qa-body{padding:0 0 22px;font:500 var(--fs-body)/1.6 var(--body);max-width:40em}
.qa .qa-body p + p{margin-top:.8em}
/* a plain link inside a sentence keeps the sentence's line height */
.qa .qa-body p a{color:var(--deep);font-weight:700;text-decoration-thickness:2px;text-underline-offset:3px}
:where(.alma-site,.site-head,.site-foot) .qa .qa-body .link-txt{margin-top:6px;color:var(--deep)}

/* ==========================================================================
   TIPS — practical facts as paper stamps (localização "Antes de vires",
   contacto "O que esperar"): .tips > .tip-wrap.lift > .tip.perf > .tip-in
   ========================================================================== */
.tips{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(26px,2.4vw,40px);margin-top:clamp(44px,3vw + 32px,84px)}
@media (min-width:640px){.tips{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1180px){.tips{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tip-wrap{position:relative;z-index:1}
/* soft shade drawn behind the stamp, as on the price sheet */
.tip-wrap::before{content:"";position:absolute;inset:8px 6px 0;z-index:-1;border-radius:20px;background:rgba(20,19,19,.32);transform:translateY(14px);filter:blur(11px)}
.s-ink .tip-wrap::before{background:rgba(0,0,0,.45)}
.tips > .tip-wrap:nth-child(4n/**/+1){transform:rotate(-1.3deg)}
.tips > .tip-wrap:nth-child(4n/**/+2){transform:rotate(.9deg)}
.tips > .tip-wrap:nth-child(4n/**/+3){transform:rotate(-.6deg)}
.tips > .tip-wrap:nth-child(4n/**/+4){transform:rotate(1.2deg)}
.tip{--r:11px;height:100%;margin:0;background:var(--paper);color:var(--ink)}
@media (max-width:699.98px){.tip{--r:8px}}
.tip-in{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(12px,.6vw + 10px,16px);height:100%;padding:clamp(20px,1vw + 16px,30px) clamp(18px,1vw + 14px,28px) clamp(22px,1vw + 18px,30px);border:clamp(2px,.05vw + 1.8px,2.5px) solid var(--ink);border-radius:8px}
.tip-alert .tip-in{border-color:var(--red)}
.tip-top{display:flex;align-items:center;justify-content:space-between;align-self:stretch;gap:12px}
.tip-ic{display:grid;place-items:center;flex:none;width:clamp(56px,1.2vw + 51px,68px);aspect-ratio:1;border-radius:50%;background:var(--red);color:var(--paper);font:400 clamp(24px,.5vw + 22px,30px)/1 var(--display)}
.tip-ic .ic{width:52%;height:52%;stroke-width:2.4}
.tip-ic .star{width:46%;height:46%;color:var(--paper)}
:where(.alma-site,.site-head,.site-foot) .tip-top .label{color:var(--deep);font-size:clamp(12.5px,.15vw + 12px,14px);text-align:right}
.tip h3{font:400 clamp(30px,1.1vw + 25px,44px)/.94 var(--display);text-transform:uppercase}
.tip p{font:500 clamp(15.5px,.2vw + 14.8px,17.5px)/1.5 var(--body);color:var(--muted)}
:where(.alma-site,.site-head,.site-foot) .tip .link-arrow{margin-top:auto;color:var(--deep)}
.tip .soon{margin-top:auto}
.tips-note{display:flex;gap:12px;margin-top:clamp(40px,2.4vw + 30px,64px);font:500 clamp(16px,.19vw + 15.3px,18px)/1.5 var(--body)}
.tips-note .star{margin-top:.25em}

/* The native set_language form is shared, so language switching works without JS. */
.lang{border:0;padding:0}
.lang .join{display:inline-flex;border:2px solid currentColor;border-radius:999px;padding:3px;background:transparent;color:inherit}
.lang button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:32px;padding:0 10px;border:0;border-radius:999px;background:transparent;font:700 14px/1 var(--label);letter-spacing:.1em;color:inherit;opacity:1}
.lang button[aria-current]{background:var(--paper);color:var(--red)}
.lang button > span:not(.sr-only){padding:0}
.site-foot .lang button[aria-current]{color:var(--ink)}
:where(.alma-site,.site-head,.site-foot) .btn{height:auto;flex-shrink:0}
.alma-preview{margin-top:24px;font:500 14px/1.5 var(--body);color:var(--paper)}
.alma-empty{padding:30px;border:2px dashed currentColor;border-radius:12px}
.alma-native-booking .btn{white-space:normal}
.alma-product-summary{display:grid;gap:12px;margin-top:22px}
:where(.alma-site,.site-head,.site-foot) a[href]:focus-visible{outline-offset:5px}
/* Occupied days get room for editable class details on both weekly calendars. */
.week .day:has(.perf){flex:2;border:0;background:var(--red);color:var(--paper);justify-content:center;gap:8px;padding:14px 6px}
.week .day:has(.perf) > .day-n{color:var(--cream)}
.week .perf{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:0;background:var(--red);color:var(--paper);text-align:center;-webkit-mask-box-image-source:none;mask-border-source:none}
.week .perf .day-n{font-size:clamp(14px,1.4vw,20px);line-height:1.15;letter-spacing:.04em;overflow-wrap:normal}
.week .perf .day-s{font:600 clamp(14px,.3vw + 12px,16px)/1.2 var(--label);overflow-wrap:anywhere}
.week .perf .day-t{font:700 clamp(12.5px,.3vw + 10px,15px)/1.2 var(--label);letter-spacing:0;white-space:nowrap}
.week .day:has(.perf) :is(.alma-week-empty,.alma-empty-day){display:none}
.alma-week-empty{font-size:22px}
.alma-event-preview + .alma-event-preview{margin-top:60px}
.stamp-soon[href]{color:var(--deep);min-height:44px;text-underline-offset:4px}
/* Native behavior components retain readable semantic button variants. */
.alma-site .btn-primary{background:var(--red);color:var(--paper);border-color:var(--red)}
.alma-site .btn-primary:hover{background:var(--deep);border-color:var(--deep)}
.alma-site .btn-outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.alma-site .btn-outline:hover{background:var(--ink);color:var(--paper)}
.alma-site .btn-ghost{background:transparent;color:inherit}
.alma-site .btn-error{background:var(--color-error);color:var(--color-error-content);border-color:var(--color-error)}
.alma-site .btn-neutral{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.day:has(.alma-week-slot) > .alma-week-label{display:none}
/* Supplied media keeps its full frame inside the Postal cards. */
.alma-site .alma-media-head{max-width:880px;margin-bottom:48px}
.alma-site .alma-media-head .h2{margin-block:20px 24px;line-height:1.04}
.alma-site .alma-media-grid{display:grid;gap:36px;align-items:start}
.alma-site .alma-media-card{min-width:0;padding:14px 14px 0;box-shadow:8px 10px 0 color-mix(in srgb,var(--ink) 18%,transparent)}
.alma-site .alma-media-card :is(.pc-img,video){aspect-ratio:auto}
.alma-site .alma-media-card .pc-img img{width:100%;height:auto;object-fit:contain}
.alma-site .alma-media-card video{display:block;width:100%;height:auto;background:var(--ink);color:var(--paper)}
.alma-site .alma-media-card figcaption{white-space:normal;line-height:1.2;padding:14px 2px;min-height:0}
.alma-site .alma-media-photos{margin-top:48px}
.alma-site .alma-media-videos{justify-items:center}
.alma-site .alma-media-videos .alma-media-card{width:min(100%,340px)}
.alma-site .alma-media-placeholder{display:grid;place-content:center;gap:18px;min-height:240px;padding:24px;background:var(--red);color:var(--paper);text-align:center}
.alma-site .alma-media-placeholder b{font:400 clamp(30px,4vw,60px)/1.1 var(--display);text-transform:uppercase}
.alma-site .stamp-img img.alma-class-photo{object-fit:contain}
@media(min-width:700px){.alma-site .alma-media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}.alma-site .alma-media-videos{grid-template-columns:repeat(2,minmax(0,340px));justify-content:center}}

.alma-site .site-video { --video-ink: var(--ink); --video-paper: var(--paper); --video-focus: var(--gold); }