/*
Theme Name: Blessings by Josy
Description: Block-Theme für Blessings by Josy (Mallorca). Eukalyptus-Palette, Cormorant Garamond und Jost, lokal eingebunden (keine Google-Fonts-Verbindung).
Version: 0.2.3
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: blessings-by-josy
*/

html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased}
.wp-site-blocks>*+*{margin-block-start:0}
.wp-site-blocks main{margin-top:0}

/* Labels */
.eyebrow{font-family:var(--wp--preset--font-family--sans);font-size:.72rem!important;font-weight:400;letter-spacing:.32em;text-transform:uppercase;margin:0}
.eyebrow-champagne{color:var(--wp--preset--color--champagne)}
.eyebrow-eucalyptus{color:var(--wp--preset--color--eucalyptus)}

/* Haarlinie in Champagner */
.hairline{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--wp--preset--color--champagne),transparent);margin:3rem auto;max-width:10rem}

/* Kopfzeile: auf der Startseite über dem Hero, sonst normal */
.site-header{position:relative;z-index:20;padding:1.5rem clamp(1.5rem,4vw,2.5rem);background:var(--wp--preset--color--ivory);color:var(--wp--preset--color--night)}
.site-header a{color:inherit;text-decoration:none}
.home .site-header{position:absolute;left:0;right:0;top:0;background:transparent;color:var(--wp--preset--color--ivory)}
.site-header .wp-block-site-title{font-family:var(--wp--preset--font-family--display);font-size:1.5rem;letter-spacing:.2em;text-transform:uppercase;font-weight:400;margin:0}
.site-header .wp-block-navigation{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase}

/* Buttons */
.btn-veil .wp-block-button__link,.btn-luxe .wp-block-button__link{border-radius:0;font-family:var(--wp--preset--font-family--sans);font-size:.72rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;padding:1rem 2.25rem;transition:background .5s ease,color .5s ease,border-color .5s ease}
.btn-veil .wp-block-button__link{background:transparent;color:var(--wp--preset--color--ivory);border:1px solid rgba(216,201,168,.7)}
.btn-veil .wp-block-button__link:hover{background:var(--wp--preset--color--champagne);color:var(--wp--preset--color--night)}
.btn-luxe .wp-block-button__link{background:var(--wp--preset--color--forest);color:var(--wp--preset--color--ivory);border:1px solid var(--wp--preset--color--forest)}
.btn-luxe .wp-block-button__link:hover{background:var(--wp--preset--color--night);border-color:var(--wp--preset--color--champagne)}

/* Hero */
.hero{color:var(--wp--preset--color--ivory)}
.hero .wp-block-cover__inner-container{max-width:1280px;margin:0 auto;padding:0 clamp(1.5rem,4vw,2.5rem) clamp(4rem,8vw,7rem);width:100%}
.hero-title{font-size:clamp(2.8rem,8vw,6rem);line-height:1.02;max-width:56rem;margin:1.5rem 0 0;color:var(--wp--preset--color--ivory)}
.hero-title em{color:var(--wp--preset--color--champagne)}
.hero-text{max-width:32rem;margin-top:2rem;color:var(--wp--preset--color--linen)}
.hero .wp-block-buttons{margin-top:2.5rem}

/* Abschnitte */
.sec{padding:clamp(5rem,10vw,9rem) clamp(1.5rem,4vw,2.5rem)}
.sec-inner{max-width:1280px;margin:0 auto}
.sec-narrow{max-width:56rem;margin:0 auto;text-align:center}
.bg-linen{background:var(--wp--preset--color--linen)}
.bg-night{background:var(--wp--preset--color--night);color:var(--wp--preset--color--ivory)}
.bg-forest{background:var(--wp--preset--color--forest);color:var(--wp--preset--color--ivory)}
.bg-seasage{background:rgba(201,211,200,.6)}
.sec h2{font-size:clamp(2.2rem,5vw,3.75rem)}
.sec em{color:var(--wp--preset--color--eucalyptus)}
.bg-night em,.bg-forest em{color:var(--wp--preset--color--champagne)}
.muted{color:var(--wp--preset--color--eucalyptus)}
.bg-night .muted,.bg-forest .muted{color:var(--wp--preset--color--seasage)}

/* Zeremonien */
.cer{gap:clamp(2rem,6vw,4rem)!important;margin-top:clamp(4rem,9vw,8rem)!important;align-items:center}
.cer h3{font-size:clamp(2rem,4vw,3rem);margin:1.25rem 0 0}
.cer .num{font-family:var(--wp--preset--font-family--display);font-style:italic;font-size:clamp(3.5rem,7vw,6rem);line-height:1;color:var(--wp--preset--color--eucalyptus);margin:0 0 1rem}
.photo{min-height:28rem;display:flex;align-items:flex-end;padding:1.25rem;background:linear-gradient(160deg,var(--wp--preset--color--seasage),var(--wp--preset--color--eucalyptus));box-shadow:0 30px 60px -30px rgba(38,55,47,.45)}
.photo p{margin:0;font-size:.8rem;background:rgba(248,246,240,.8);padding:.15rem .6rem;color:var(--wp--preset--color--night)}

/* Ablauf */
.step{border-top:1px solid rgba(216,201,168,.3);padding-top:2rem}
.step .n{font-family:var(--wp--preset--font-family--display);font-style:italic;font-size:3rem;line-height:1;color:var(--wp--preset--color--champagne);margin:0}
.step h3{font-size:1.9rem;margin:1.25rem 0 .75rem}

/* Platzhalter für fehlende Inhalte */
.todo{display:inline;padding:1px 6px;background:rgba(216,201,168,.35);font-size:.85em}
.bg-night .todo,.bg-forest .todo{background:rgba(255,255,255,.14)}

/* Footer */
.site-footer{background:var(--wp--preset--color--night);color:var(--wp--preset--color--seasage);padding:3rem clamp(1.5rem,4vw,2.5rem)}
.site-footer a{color:inherit;text-decoration:none}
.site-footer .wp-block-site-title{font-family:var(--wp--preset--font-family--display);font-size:1.25rem;letter-spacing:.2em;text-transform:uppercase;color:var(--wp--preset--color--ivory);margin:0}

@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){.hero .wp-block-cover__inner-container>*{animation:rise 1.4s cubic-bezier(.22,1,.36,1) both}.hero .wp-block-cover__inner-container>*:nth-child(2){animation-delay:.15s}.hero .wp-block-cover__inner-container>*:nth-child(3){animation-delay:.3s}.hero .wp-block-cover__inner-container>*:nth-child(4){animation-delay:.45s}}

/* ---------- Mobile first: Layout nach Mockup ---------- */
.mob-only{display:none}
.sec-narrow.left{text-align:left;margin-left:0}
.bless-list .bl-item{margin:0;border-bottom:1px solid rgba(101,125,112,.28)}
.bless-list .bl-item:last-of-type{border-bottom:0}
.bless-list .bl-item a{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4rem;padding:1.1rem 0;text-decoration:none;color:var(--wp--preset--color--night);font-family:var(--wp--preset--font-family--display);font-size:1.4rem;letter-spacing:.14em;text-transform:uppercase}
.bless-list .bl-item a span{font-family:var(--wp--preset--font-family--sans);font-size:1.1rem}

@media (max-width:781px){
  .mob-only{display:block}
  .bless-list{text-align:center;padding-top:2rem;padding-bottom:3rem}
  .bless-list .hairline{margin:1.5rem auto 1.5rem}
  .bless-list .bl-item{text-align:left}

  /* Kopf: zentrierte Wortmarke über dem Hero, Menü rechts */
  .home .site-header{position:relative;background:var(--wp--preset--color--ivory);color:var(--wp--preset--color--night)}
  .site-header .wp-block-group{justify-content:center!important;position:relative}
  .site-header .wp-block-site-title{font-size:1.4rem;letter-spacing:.3em;text-align:center}
  .site-header .wp-block-navigation{position:absolute;right:0;top:50%;transform:translateY(-50%)}

  /* Hero: Foto unter der Kopfzeile, geschwungene Unterkante */
  .hero{min-height:680px!important}
  .hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;z-index:2;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 60' preserveAspectRatio='none'><path d='M0 44 C100 8 240 6 390 38 L390 60 L0 60 Z' fill='%23F8F6F0'/></svg>") center bottom/100% 100% no-repeat}
  .hero .wp-block-cover__inner-container{padding-bottom:6rem}
  .hero-title{font-size:clamp(2.25rem,10.4vw,3rem);font-weight:400}
  .hero .eyebrow{line-height:2}

  /* Ablauf und Absätze: zentriert, ruhiger */
  .sec{padding-top:4rem;padding-bottom:4rem}
  .cer{margin-top:3.5rem!important}
}

/* ---------- v0.2.2 Feinschliff ---------- */
/* Kein WordPress-Blockabstand zwischen den Abschnitten (sonst heller Streifen) */
main.wp-block-group>*,.wp-site-blocks>main>*{margin-block-start:0!important;margin-block-end:0!important}
/* Buttons nur so breit wie ihr Text */
.wp-block-buttons .wp-block-button{width:auto;flex:0 0 auto}
/* Hero ohne Foto: ruhiger Waldgrün-Verlauf mit Champagner-Schimmer. Mit Foto greift das nicht. */
.hero.wp-block-cover:not(:has(img)) .wp-block-cover__background{opacity:1!important;background:radial-gradient(60% 50% at 80% 25%,rgba(216,201,168,.22),rgba(216,201,168,0) 70%),linear-gradient(160deg,#3c554a 0%,#26372F 62%,#1c2924 100%)!important}

/* ---------- v0.2.3 ---------- */
/* Kein Blockabstand zwischen Header, Main und Footer */
.wp-site-blocks>*{margin-block-start:0!important;margin-block-end:0!important}