/* Sun On Our Skin — Blocks  (inherits theme vars, with fallbacks) */
.sos-shaped,.sos-about,.sos-seh{--terra:var(--sos-terra,#C9542C);--ink:var(--sos-ink,#2B2926);--cream:var(--sos-cream,#FBF7F0);--link:var(--sos-link,#A8431F);--head:var(--sos-font-head,'Playfair Display',Georgia,serif)}

/* ---------- Shaped Media ---------- */
.sos-shaped{width:100%;overflow:visible}
.sos-shaped__inner{position:relative;width:100%;height:var(--sos-h,440px);overflow:hidden;border-radius:14px}
.sos-shaped__inner img,.sos-shaped__inner video{width:100%;height:100%;object-fit:cover;display:block;will-change:transform}
.sos-shaped__overlay{position:absolute;inset:0;opacity:.32;pointer-events:none}
.sos-shape-circle .sos-shaped__inner{aspect-ratio:1;height:auto;border-radius:50%}
.sos-shape-arch .sos-shaped__inner{border-radius:50% 50% 14px 14px/40% 40% 14px 14px}
.sos-shape-blob .sos-shaped__inner{border-radius:42% 58% 60% 40%/45% 45% 55% 55%}
.sos-shape-wave .sos-shaped__inner{border-radius:14px;-webkit-mask:radial-gradient(120% 90% at 50% 0,#000 70%,transparent 71%);mask:radial-gradient(120% 90% at 50% 0,#000 70%,transparent 71%)}
/* reveal effect base */
.sos-shaped[data-sos-effect="reveal"] .sos-shaped__inner{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.sos-shaped[data-sos-effect="reveal"].is-in .sos-shaped__inner{opacity:1;transform:none}

/* ---------- About Duo ---------- */
.sos-about{display:grid;grid-template-columns:minmax(0,460px) 1fr;gap:50px;align-items:center;max-width:1100px;margin:0 auto}
.sos-about--right{grid-template-columns:1fr minmax(0,460px)}
.sos-about--right .sos-about__photo{order:2}
.sos-about__photo img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%}
.sos-about__head{position:relative;margin-bottom:18px;min-height:90px}
.sos-about__ghost{font-family:var(--head);font-weight:700;font-size:clamp(52px,7vw,92px);line-height:.9;color:#E7D3C8;display:block;letter-spacing:.02em}
.sos-about__name{position:absolute;left:0;bottom:6px;font-family:'Caveat',cursive;font-weight:600;font-size:clamp(30px,4vw,46px);color:var(--ink)}
.sos-about__text{color:var(--sos-text,#6B665E);font-size:16px;line-height:1.7;margin:0 0 14px}
.sos-about__links a{color:var(--link);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}
.sos-about__links span{color:var(--sos-meta,#9A9286)}
.sos-about__social{display:flex;gap:10px;margin-top:16px}
.sos-about__social a{width:34px;height:34px;border-radius:50%;background:var(--cream);display:inline-flex;align-items:center;justify-content:center;color:var(--ink)}
.sos-about__social a:hover{background:var(--terra);color:#fff}
.sos-about__social svg{width:16px;height:16px}

/* ---------- Scroll-Expand Hero ---------- */
.sos-seh{position:relative;height:var(--sos-seh-len,140vh)}
.sos-seh__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.5}
.sos-seh__sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.sos-seh__media{position:relative;width:58%;height:62%;border-radius:18px;overflow:hidden;will-change:width,height,border-radius;box-shadow:0 30px 80px rgba(0,0,0,.18)}
.sos-seh__media img,.sos-seh__media video{width:100%;height:100%;object-fit:cover;display:block}
.sos-seh__text{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:24px;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.sos-seh__eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.92;margin-bottom:10px}
.sos-seh__title{font-family:var(--head);font-weight:700;font-size:clamp(28px,5vw,60px);color:#fff;margin:0;line-height:1.1}
.sos-seh__hint{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.85;text-shadow:0 1px 10px rgba(0,0,0,.5)}

@media(max-width:767px){
  .sos-about{grid-template-columns:1fr;gap:26px;text-align:center}
  .sos-about--right .sos-about__photo{order:0}
  .sos-about__photo img{max-width:300px;margin:0 auto}
  .sos-about__head{text-align:center}
  .sos-about__name{position:static;display:block;margin-top:-10px}
  .sos-about__social{justify-content:center}
  .sos-seh__media{width:85%;height:48%}
}
@media(prefers-reduced-motion:reduce){
  .sos-shaped img,.sos-shaped video{transform:none!important}
  .sos-shaped[data-sos-effect="reveal"] .sos-shaped__inner{opacity:1;transform:none}
}
