/* ==========================================================================
   prices.css — prices page: package cards, order bar and order dialog
   ========================================================================== */
.prices-hero .breadcrumb{margin-bottom:18px}
.prices-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.prices-tabs a{
  padding:7px 14px;border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--surface-hover);
  color:var(--text-muted);font-size:var(--fs-small);font-weight:700;transition:color .2s var(--ease),border-color .2s var(--ease),background-color .2s var(--ease)
}
.prices-tabs a:hover{color:var(--accent-text);border-color:var(--accent-text)}
.prices-hero .prices-policy{margin:clamp(24px,3vw,32px) auto 0;max-width:62ch;text-align:center;color:var(--text);font-size:var(--fs-small);font-weight:600}

.prices-section{scroll-margin-top:calc(var(--header-h) + 12px)}
/* tighter rhythm on this page: tabs → policy → first section use the same gap */
.prices-hero{padding-bottom:0}
.prices-section{padding-block:clamp(36px,4.5vw,56px)}
.prices-section + .prices-section{padding-top:0}
#pricesList > .prices-section:first-child{padding-top:clamp(24px,3vw,32px)}
#pricesList > .prices-section:last-child{padding-bottom:0}
body[data-page="prices"] .site-footer{margin-top:clamp(24px,3vw,32px)}

/* ---------- Package cards ---------- */
/* every row fills the full content width (same edges as the header) */
.plans{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))}
.plans--two,.plans--four{grid-template-columns:repeat(2,minmax(0,1fr))}
.plans--one{grid-template-columns:1fr}
.plans--five .plan--featured{grid-column:span 2}
@media (max-width:900px){
  .plans,.plans--three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plans--three .plan:last-child{grid-column:1/-1}
  .plans--one{grid-template-columns:1fr}
}
/* a single package: one wide card, laid out in a row on larger screens */
@media (min-width:901px){
  .plans--one .plan{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(220px,.8fr);grid-template-areas:"name features actions" "price features actions";align-items:center;column-gap:32px;row-gap:6px}
  .plans--one .plan-name{grid-area:name;align-self:end}
  .plans--one .plan-price{grid-area:price;align-self:start}
  .plans--one .plan-features{grid-area:features;border-top:0;padding:0 28px;border-inline-start:1px solid var(--hairline)}
  .plans--one .plan-actions{grid-area:actions}
  .plans--one .plan--noname{grid-template-areas:"price features actions"}
  .plans--one .plan--noname .plan-price{align-self:center}
}
.plan{display:flex;flex-direction:column;gap:14px;padding:24px 22px 22px;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}
@media (hover:hover){.plan:hover{transform:translateY(-4px);border-color:var(--border-strong);box-shadow:var(--inset-highlight),var(--shadow)}}
.plan--featured{border-color:rgba(237,189,77,.6);box-shadow:var(--inset-highlight),0 0 0 1px rgba(237,189,77,.25),var(--shadow)}
:root[data-theme="light"] .plan--featured{border-color:rgba(11,107,91,.5);box-shadow:var(--inset-highlight),0 0 0 1px rgba(11,107,91,.2),var(--shadow)}
.plan-badge{
  align-self:flex-start;padding:5px 12px;border-radius:var(--radius-pill);background:var(--btn-primary-bg);color:var(--btn-primary-text);
  font-size:.75rem;font-weight:800;line-height:1.4
}
.plan-name{font-size:1.12rem;line-height:1.45}
.plan-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0}
.plan-price-from{font-size:var(--fs-small);font-weight:700;color:var(--text-muted)}
.plan-price-main{font-size:clamp(1.7rem,1.3rem + 1vw,2.1rem);font-weight:800;line-height:1.1;color:var(--accent-text)}
html[lang="en"] .plan-price-main{font-family:var(--font-en);letter-spacing:-.02em}
.plan-price-alt{font-size:.95rem;font-weight:700;color:var(--text-muted)}
.plan-desc{margin:0;color:var(--text-muted);font-size:.92rem;line-height:1.7}
.plan-features{display:grid;gap:8px;margin:0;padding:14px 0 0;border-top:1px solid var(--hairline);flex:1}
.plan-features li{position:relative;padding-inline-start:22px;font-size:.92rem;color:var(--text-muted);line-height:1.6}
.plan-features li::before{
  content:"";position:absolute;inset-inline-start:0;top:.45em;width:14px;height:14px;border-radius:50%;
  background:rgba(237,189,77,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23edbd4d' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E") center/9px no-repeat
}
:root[data-theme="light"] .plan-features li::before{background-color:rgba(11,107,91,.12);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b6b5b' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E")}
.plan-features strong{color:var(--text);font-weight:800}
.plan-reach{display:inline-block;margin-top:2px;font-size:1rem;color:var(--text)}
.plan-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.plan-actions .btn{padding:0 10px;white-space:normal;line-height:1.25}
.plan-actions .btn.is-added{border-color:var(--accent-text);color:var(--accent-text)}
.prices-note{margin-top:16px;color:var(--text-subtle);font-size:var(--fs-small)}

/* ---------- Order bar ---------- */
.cart-bar{position:fixed;z-index:94;inset-inline:0;bottom:max(16px,env(safe-area-inset-bottom,0px));display:flex;justify-content:center;padding-inline:16px;pointer-events:none}
.cart-bar[hidden]{display:none}
.cart-bar-inner{
  pointer-events:auto;display:flex;align-items:center;gap:14px;width:min(560px,100%);padding:10px 10px 10px 18px;
  border-radius:var(--radius-pill);background:var(--menu-bg);border:1px solid rgba(237,189,77,.5);box-shadow:var(--shadow);
  animation:cartIn .5s cubic-bezier(.34,1.56,.64,1) both
}
html[dir="rtl"] .cart-bar-inner{padding:10px 18px 10px 10px}
:root[data-theme="light"] .cart-bar-inner{border-color:rgba(11,107,91,.4)}
.cart-bar-info{display:grid;min-width:0;flex:1;line-height:1.4}
.cart-bar-info strong{font-size:.95rem}
.cart-bar-info span{font-size:.8rem;color:var(--text-muted)}
.cart-bar.is-bump .cart-bar-inner{animation:cartBump .45s ease}
@keyframes cartIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes cartBump{0%,100%{transform:none}40%{transform:scale(1.04)}}
/* keep the WhatsApp button and the registration card above the order bar */
body.has-cart .floating-whatsapp{bottom:calc(max(20px,env(safe-area-inset-bottom,0px)) + 76px)}
body.has-cart .reg-toast{bottom:calc(max(20px,env(safe-area-inset-bottom,0px)) + 76px)}
body.has-cart .site-footer{padding-bottom:84px}

/* ---------- Order dialog ---------- */
.order-dialog{
  width:min(620px,calc(100vw - 24px));max-height:min(92vh,880px);padding:0;border:1px solid var(--border-strong);border-radius:var(--radius-lg);
  background:var(--menu-bg);color:var(--text);box-shadow:var(--shadow);overflow:auto;overscroll-behavior:contain
}
.order-dialog::backdrop{background:rgba(2,20,18,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
:root[data-theme="light"] .order-dialog{background:#fff}
:root[data-theme="light"] .order-dialog::backdrop{background:rgba(7,59,54,.35)}
.order-dialog[open]{animation:dialogIn .35s cubic-bezier(.2,.8,.2,1)}
@keyframes dialogIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
html.dialog-open{overflow:hidden}
.order-sheet{display:grid;gap:18px;padding:clamp(18px,3vw,28px)}
.order-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.order-head h2{font-size:1.35rem}
.order-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.order-lines{display:grid;gap:10px;margin:0;padding:0}
.order-line{
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;padding:12px 14px;border-radius:var(--radius-sm);
  background:var(--surface-hover);border:1px solid var(--border)
}
.order-line-text{display:grid;min-width:0}
.order-line-text strong{font-size:.95rem;line-height:1.5}
.order-line-text small{font-size:.78rem;color:var(--text-subtle)}
.order-line-price{font-weight:800;color:var(--accent-text);font-size:.92rem;text-align:end}
.order-line-tools{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px}
.order-empty{padding:18px;border-radius:var(--radius-sm);border:1px dashed var(--border-strong);color:var(--text-muted);text-align:center}
.qty{display:inline-flex;align-items:center;gap:6px}
.qty button{width:30px;height:30px;border-radius:50%;border:1px solid var(--border-strong);background:transparent;font-weight:800;font-size:1rem;line-height:1;cursor:pointer}
.qty button:hover{border-color:var(--accent-text);color:var(--accent-text)}
.qty output{min-width:22px;text-align:center;font-weight:800}
.qty-unit{font-size:.8rem;color:var(--text-subtle)}
.order-remove{margin-inline-start:auto;background:none;border:0;padding:4px 2px;color:#ffb4a8;font-size:.82rem;font-weight:700;cursor:pointer}
:root[data-theme="light"] .order-remove{color:#b3261e}
.order-total{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 12px;padding:14px 16px;border-radius:var(--radius-sm);border:1px solid rgba(237,189,77,.45);background:rgba(237,189,77,.08)}
:root[data-theme="light"] .order-total{border-color:rgba(11,107,91,.3);background:rgba(11,107,91,.06)}
.order-total:empty{display:none}
.order-total span{font-weight:700}
.order-total strong{font-size:1.15rem;color:var(--accent-text)}
.order-total small{grid-column:1/-1;font-size:.78rem;color:var(--text-subtle)}
.order-form{display:grid;gap:14px}
.order-form .field textarea{min-height:72px}

@media (max-width:600px){
  .plans,.plans--two,.plans--three,.plans--four{grid-template-columns:1fr}
  .plans--three .plan:last-child,.plans--five .plan--featured{grid-column:auto}
  .prices-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);padding-bottom:4px}
  .prices-tabs::-webkit-scrollbar{display:none}
  .prices-tabs a{flex:none;font-size:.8rem;padding:6px 12px}
  .order-dialog{width:100vw;max-width:100vw;max-height:94vh;margin:auto auto 0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;border-bottom:0}
  .order-dialog[open]{animation:sheetIn .35s cubic-bezier(.2,.8,.2,1)}
  @keyframes sheetIn{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
  .cart-bar-inner{gap:10px}
  .cart-bar-info strong{font-size:.88rem}
}

/* ---------- Exclusive extras (e.g. the monthly campaign) ---------- */
.plan-perks{
  position:relative;overflow:hidden;display:grid;gap:10px;padding:14px 16px;border-radius:var(--radius-sm);
  background:linear-gradient(135deg,rgba(237,189,77,.2),rgba(237,189,77,.06));border:1px solid rgba(237,189,77,.55)
}
.plan-perks::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.16) 45%,transparent 60%);
  transform:translateX(-120%);animation:perksShine 4.5s ease-in-out 1s infinite
}
@keyframes perksShine{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
html[dir="rtl"] .plan-perks::after{animation-name:perksShineRtl}
@keyframes perksShineRtl{0%,60%{transform:translateX(120%)}100%{transform:translateX(-120%)}}
.plan-perks-title{display:flex;align-items:center;gap:8px;margin:0;font-size:.8rem;font-weight:800;color:var(--accent-text);letter-spacing:.01em}
.plan-perks-title svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plan-perks ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.plan-perks li{
  display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:var(--radius-pill);
  background:var(--btn-primary-bg);color:var(--btn-primary-text);font-size:.88rem;font-weight:800;line-height:1.3
}
.plan-perks li::before{
  content:"";width:16px;height:16px;flex:none;border-radius:50%;background:rgba(0,0,0,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E") center/10px no-repeat
}
:root[data-theme="light"] .plan-perks{background:linear-gradient(135deg,rgba(11,107,91,.12),rgba(11,107,91,.03));border-color:rgba(11,107,91,.4)}
:root[data-theme="light"] .plan-perks::after{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%)}