/* Meetisy shared visual theme — loaded last on every page. Visual only. */
:root{
  --green:#003e36;--green-2:#0b5a4e;--coral:#ff536f;--coral-2:#e8405d;--pink:#ffb7bb;--yellow:#ffd477;
  --cream:#fff8ef;--cream-2:#fbeee0;--paper:#fffdf9;--ink:#0f3a33;--muted:#5f6f69;--line:#efe2d3;
  --radius:22px;--radius-sm:14px;--pill:999px;
  --shadow:0 1px 0 #fff inset,0 12px 32px -18px rgba(0,62,54,.28);
  --shadow-lg:0 24px 60px -28px rgba(0,62,54,.35);
  --font:"Nunito","Quicksand","Arial Rounded MT Bold",system-ui,sans-serif;
}
html{-webkit-font-smoothing:antialiased}
body{font-family:var(--font)!important;background:
  radial-gradient(900px 500px at 105% -10%,color-mix(in oklab,var(--pink) 45%,transparent),transparent 70%),
  radial-gradient(700px 420px at -10% 110%,color-mix(in oklab,var(--yellow) 40%,transparent),transparent 70%),
  var(--cream) fixed;color:var(--ink);overflow-x:hidden}
button,input,select,textarea{font-family:var(--font)!important}
h1,h2,h3,h4{font-family:var(--font);color:var(--green);font-weight:900;letter-spacing:-.02em!important}
h1{font-size:clamp(34px,4.2vw,58px);line-height:1.06}
h2{font-size:clamp(24px,2.6vw,36px);line-height:1.15}
h3{font-size:clamp(16px,1.4vw,19px)}
p{line-height:1.65}
em{color:var(--coral)}

/* Header */
body:not(.app):not(.plain) .header{position:sticky;top:12px;z-index:20;max-width:1320px;margin:12px auto 0;padding:12px 22px!important;
  background:color-mix(in oklab,var(--paper) 88%,transparent);backdrop-filter:blur(10px);
  border:1px solid var(--line);border-radius:var(--pill);box-shadow:var(--shadow)}
.header .logo img,footer .logo img{height:44px;width:auto;display:block}
.header nav a{color:var(--green);font-weight:800;padding:6px 4px;border-radius:var(--pill)}
.header nav a:hover{color:var(--coral)}

/* Buttons — capsule */
.button,.secondary-btn,.danger-btn,.text-button{border-radius:var(--pill)!important;font-weight:800!important;
  letter-spacing:.01em;transition:transform .18s,box-shadow .18s,background .18s,color .18s}
.button{background:var(--coral)!important;color:#fff!important;padding:14px 26px!important;font-size:14px!important;
  box-shadow:0 10px 22px -12px var(--coral);border:0}
.button:hover{background:var(--coral-2)!important;transform:translateY(-2px)}
.button.small{padding:10px 18px!important;font-size:13px!important}
.header .button,.button.secondary,.closing .button{background:var(--yellow)!important;box-shadow:0 10px 22px -12px var(--green)}
.header .button:hover,.button.secondary:hover{background:var(--green-2)!important}
.secondary-btn{background:var(--paper)!important;color:var(--green)!important;border:1.5px solid var(--green)!important;padding:12px 22px!important}
.secondary-btn:hover{background:var(--yellow)!important;color:var(--green)!important}
.danger-btn{background:#fff0f2!important;color:#b3203b!important;border:1.5px solid var(--pink)!important}
.text-link,.text-button{color:var(--green)!important;font-weight:800}
.text-link:hover{color:var(--coral)!important}
.filter{border-radius:var(--pill)!important;border:1.5px solid var(--line)!important;background:var(--paper)!important;color:var(--green)!important;font-weight:700;font-size:13px!important}
.filter.active,.filter[aria-pressed=true]{background:var(--yellow)!important;border-color:var(--yellow)!important;color:var(--green)!important}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--coral)!important;outline-offset:3px!important}

/* Surfaces */
.card,.panel,.flow-card,.room-panel,.method-panel,.status-box,details{
  background:var(--paper);border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow)}
.card{overflow:hidden}
.card:hover{box-shadow:var(--shadow-lg)}
.card-image img{border-radius:0}
.tag,.room-tag,.status-pill{background:var(--yellow)!important;color:var(--green)!important;border-radius:var(--pill)!important;font-weight:800}
.eyebrow{color:var(--coral);font-weight:900;letter-spacing:.14em}
.hint,.muted,.permission-note{color:var(--muted)}

/* Demo notices stay clearly visible */
.demo-strip,.demo-banner,.simulation-label,.draft,.method-notice{background:color-mix(in oklab,var(--yellow) 55%,var(--cream))!important;
  color:var(--green)!important;border:1px dashed color-mix(in oklab,var(--green) 35%,transparent)!important;border-radius:var(--radius-sm)!important}

/* Forms */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),select,textarea{
  background:#fff!important;border:1.5px solid var(--line)!important;border-radius:var(--radius-sm)!important;
  padding:12px 16px!important;color:var(--ink)!important;font-size:15px!important;min-height:46px;box-shadow:none}
.search input{border:0!important;min-height:auto;padding:6px!important;background:transparent!important}
.search{background:#fff;border:1.5px solid var(--line)!important;border-radius:var(--pill);padding:4px 16px!important}
input:focus,select:focus,textarea:focus{border-color:var(--green)!important}
input[aria-invalid=true],input:user-invalid{border-color:var(--coral)!important}
label{color:var(--green);font-weight:700}
input[type=checkbox],input[type=radio]{accent-color:var(--coral);width:18px;height:18px}
.consent,.check-line{line-height:1.55}
.upload{border:2px dashed var(--pink)!important;border-radius:var(--radius)!important;background:#fff6f6!important}

/* Accents */
.ticker{background:transparent!important;color:var(--green)!important}
.closing{background:var(--pink)!important;border-radius:32px!important}
.round-note{background:var(--yellow)!important}
.hero-visual>img{border-radius:200px 200px 32px 32px!important;box-shadow:var(--shadow-lg)}
.steps article>span{background:var(--pink)!important;color:var(--green);font-weight:900}

/* Dialog & toast */
dialog{background:var(--paper)!important;border-radius:28px!important;box-shadow:var(--shadow-lg)!important}
#toast{background:var(--yellow)!important;border-radius:var(--pill)!important;font-weight:700}

/* Footer */
footer{border-top:1px solid var(--line);margin-top:40px}

@media(max-width:700px){
  .header{top:8px;margin:8px 10px 0;padding:10px 14px!important}
  .header .logo img{height:34px}
  h1{font-size:clamp(32px,9vw,44px)}
  .button{padding:13px 20px!important}
}
img,video{max-width:100%}
.button,.secondary-btn,.danger-btn,a,summary,.photo-label{font-family:var(--font)!important}
.hero-caption{font-family:var(--font)!important;font-weight:800;color:var(--green)}

/* The public homepage shares the reference’s organic background. */
body:not(.app):not(.plain){position:relative;isolation:isolate;background:var(--cream)!important}
body:not(.app):not(.plain)::before,body:not(.app):not(.plain)::after{content:"";position:fixed;z-index:-1;pointer-events:none;background-repeat:no-repeat;background-size:contain}
body:not(.app):not(.plain)::before{top:-90px;right:-110px;width:min(46vw,560px);aspect-ratio:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cpath fill='%23FFB7BB' d='M262 18c70 6 132 60 128 140-4 74-58 92-60 150-2 66-84 98-150 70C110 352 40 330 26 254 12 176 70 150 92 92 116 34 190 12 262 18z'/%3E%3Cpath fill='%23FFD477' d='M70 30c40-10 74 20 70 56-4 34-40 40-66 34C40 112 8 92 14 64 20 40 44 36 70 30z'/%3E%3Cpath fill='%23FF536F' d='M340 300c34 4 54 34 46 62-8 26-40 36-64 26-26-10-32-36-24-58 8-20 22-32 42-30z'/%3E%3C/svg%3E")}
body:not(.app):not(.plain)::after{bottom:-120px;left:-120px;width:min(40vw,480px);aspect-ratio:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cpath fill='%23FFD477' d='M150 40c80-20 170 30 196 110 24 76-30 150-110 176C150 354 60 320 34 244 10 170 70 60 150 40z'/%3E%3Cpath fill='%23FF536F' d='M300 60c26-6 52 12 54 38 2 24-20 44-44 44-22 0-40-16-40-38 0-20 12-40 30-44z'/%3E%3Cpath fill='%23FFB7BB' d='M60 300c30-8 64 10 70 40 6 28-20 50-50 52-28 2-50-18-50-44 0-22 10-42 30-48z'/%3E%3C/svg%3E")}

@media(max-width:700px){body:not(.app):not(.plain)::before,body:not(.app):not(.plain)::after{width:60vw;opacity:.7}}

/* Editorial hero: one continuous scene, with a cream organic cutout. */
body:not(.app):not(.plain) .hero{
 display:block;isolation:isolate;position:relative;max-width:1440px;min-height:650px;
 margin:24px auto 48px;padding:40px 5% 50px;overflow:hidden;border-radius:30px;
 background:var(--cream);
}
body:not(.app):not(.plain) .hero-visual{
 position:absolute;inset:0;z-index:-2;margin:0;padding:0;height:100%!important;
}
body:not(.app):not(.plain) .hero-visual>img{
 position:absolute;right:0;top:0;width:82%;height:100%;object-fit:cover;object-position:62% center;
 border-radius:0!important;box-shadow:none;
 mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 720' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0H1440V625Q1330 590 1240 650T1030 650T810 665T590 620T350 665H0Z'/%3E%3C/svg%3E");mask-size:100% 100%;
}
body:not(.app):not(.plain) .hero::before{
 content:"";position:absolute;z-index:-1;left:-12%;top:-20%;width:66%;height:122%;
 background:var(--cream);border-radius:0 0 72% 0 / 0 0 62% 0;pointer-events:none;
}
body:not(.app):not(.plain) .hero-copy{width:44%;padding:0 0 24px;position:relative}
body:not(.app):not(.plain) .hero-brand{max-width:300px;margin:14px 0 18px}
body:not(.app):not(.plain) .hero h1{font-size:clamp(32px,3.6vw,50px);line-height:1.08;margin:20px 0}
body:not(.app):not(.plain) .hero-copy>p{max-width:320px;font-size:14px}
body:not(.app):not(.plain) .hero-caption{
 position:absolute;right:5%;top:26px;max-width:190px;font-size:20px;line-height:1.2;
 color:var(--green);background:var(--cream);padding:16px 20px;border-radius:48% 52% 44% 56%;transform:rotate(5deg);margin:0;
}
body:not(.app):not(.plain) .hero-visual .flower{right:3%;bottom:15px;font-size:70px}
@media(max-width:1000px) and (min-width:701px){
 body:not(.app):not(.plain) .hero-copy{width:49%}
 body:not(.app):not(.plain) .hero::before{width:72%}
 body:not(.app):not(.plain) .hero h1{font-size:36px}
}
@media(max-width:700px){
 body:not(.app):not(.plain) .hero{padding:270px 24px 30px;margin:12px 12px 28px;min-height:0;border-radius:24px}
 body:not(.app):not(.plain) .hero-visual>img{width:100%;height:340px;object-position:center;mask-image:none}
 body:not(.app):not(.plain) .hero::before{left:-20%;top:250px;width:140%;height:100%;border-radius:50% 45% 0 0 / 70px 50px 0 0}
 body:not(.app):not(.plain) .hero-copy{width:100%;padding:25px 0 0}
 body:not(.app):not(.plain) .hero-brand{max-width:220px}
 body:not(.app):not(.plain) .hero h1{font-size:36px}
 body:not(.app):not(.plain) .hero-caption{top:16px;right:16px;font-size:14px;max-width:140px;padding:12px}
 body:not(.app):not(.plain) .hero-visual .flower{display:none}
}

/* Four illustrated pillars, matching the original brand reference. */
.ticker{max-width:1000px;margin:0 auto 28px;padding:18px 24px 28px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;background:transparent;color:var(--green);overflow:visible;white-space:normal;text-align:center}
.ticker .ticker-item{display:flex;flex-direction:column;align-items:center;gap:6px}
.ticker .ticker-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;padding:14px;letter-spacing:0}
.ticker-icon svg{width:100%;height:100%;display:block}
.ticker .people{background:#ffced1;color:#003e36}.ticker .calendar{background:#ffe19a;color:#003e36}.ticker .plane{background:#d4efe0;color:#006b54}.ticker .heart{background:#e9dcf7;color:#65418a}
.ticker strong{font-size:15px;font-weight:900;line-height:1.2}.ticker small{font-size:12px;line-height:1.4;color:var(--muted)}
@media(max-width:700px){.ticker{gap:12px;padding:12px 16px 24px;margin-bottom:0}.ticker .ticker-icon{width:46px;height:46px;padding:11px}.ticker strong{font-size:12px}.ticker small{font-size:10px}}
@media(max-width:360px){.ticker{grid-template-columns:repeat(2,1fr);gap:22px}}

/* Reference lettering: a quiet brand tagline and handwritten photo message. */
body:not(.app):not(.plain) .hero-brand .brand-tagline{margin:10px 0 0;text-align:center;font-family:var(--font);font-size:9px;letter-spacing:3.5px;font-weight:900;color:var(--green);line-height:1.5}
body:not(.app):not(.plain) .hero-caption{font-family:"Caveat",cursive!important;font-weight:700;font-size:clamp(29px,3vw,43px);line-height:.98;text-align:center;max-width:none;right:5%;top:28px;background:transparent;border-radius:0;padding:0;transform:rotate(-8deg);color:var(--green);text-shadow:0 1px 8px #fff8efcc}
body:not(.app):not(.plain) .hero-caption span{display:block}
body:not(.app):not(.plain) .hero-caption::after{content:"";display:block;width:72%;height:4px;background:var(--coral);border-radius:100%;margin:9px auto 0;transform:rotate(-3deg)}
@media(max-width:700px){body:not(.app):not(.plain) .hero-caption{font-size:26px;top:24px;right:18px}body:not(.app):not(.plain) .hero-brand .brand-tagline{font-size:8px;letter-spacing:2.6px}}

/* Closing invitation: full-width photography with readable overlay. */
.closing{background:linear-gradient(90deg,rgba(0,40,34,.78),rgba(0,40,34,.42)),url('../02_images/hero-aperitivo.jpg') center 56% / cover!important;padding:80px 28px!important;min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.closing h2{color:var(--cream);text-shadow:0 2px 16px #00282055;position:relative;z-index:1}
.closing h2 em{color:var(--yellow)!important}
.closing .eyebrow{color:var(--cream)!important;position:relative;z-index:1}
.closing .button{background:var(--coral)!important;color:#fff;position:relative;z-index:1}
.closing .button:hover{background:#e8405d!important}
.closing .closing-flower{color:var(--pink);opacity:.4}
@media(max-width:700px){.closing{padding:50px 24px!important;min-height:360px;align-items:flex-start;background-position:62% center!important}.closing h2{font-size:30px}.closing .button{max-width:100%;gap:12px}}

/* Brand actions use coral; selected surfaces use warm yellow. */
.header .button,.button.secondary{background:var(--coral)!important;color:var(--green)!important;box-shadow:0 10px 22px -12px #ff536f66}
.manage-summary,.manage-summary h2,.manage-summary p,.manage-summary span,.registration-story,.registration-story h2,.registration-story p,.venue-banner,.venue-banner h2,.venue-banner p{color:var(--green)!important}
.request-profile-link{display:inline-flex;margin:4px 0 10px;color:var(--green);font-weight:900;text-decoration:underline;text-underline-offset:4px;background:none;border:0;padding:4px 0;font:inherit;cursor:pointer}
.request-public-profile .review-avatar{width:72px;height:72px;display:grid;place-items:center;background:var(--pink);border-radius:50%;font-size:30px;margin-bottom:16px}.request-public-profile dl{display:grid;gap:14px}.request-public-profile dt{font-size:12px;color:var(--muted)}.request-public-profile dd{margin:4px 0;font-size:14px}
