/* ============================================================
   STORAGE ROOMS .GR — Premium public marketing components
   Namespace: .srs-*  (loaded after storage-theme.css)
   ============================================================ */

.srs { --maxw: 1200px; }
.srs * { box-sizing: border-box; }
.srs-wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.srs-section { padding: 84px 0; }
.srs-section.tight { padding: 56px 0; }
.srs-bg-soft { background: var(--sr-bg); }
.srs-bg-ink  { background: var(--sr-ink); color: #fff; }
.srs-bg-tint { background: var(--sr-blue-soft); }

/* Section heading */
.srs-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
    color: var(--sr-blue); background: var(--sr-blue-soft); padding: 7px 15px; border-radius: 30px; margin-bottom: 18px;
}
.srs-bg-ink .srs-eyebrow { background: rgba(244, 73, 2,.15); color: var(--sr-teal); }
.srs-h2 { font-size: clamp(28px, 4vw, 42px); font-weight: 800; line-height: 1.08; margin: 0 0 16px; letter-spacing: -.5px; }
.srs-lead { font-size: 18px; color: var(--sr-muted); max-width: 640px; line-height: 1.6; margin: 0; }
.srs-bg-ink .srs-lead { color: #ddd2ca; }
.srs-center { text-align: center; }
.srs-center .srs-lead { margin-left: auto; margin-right: auto; }

/* ── HERO (light) ── */
.srs-hero { position: relative; overflow: hidden; background: linear-gradient(165deg, #ffffff 0%, #FFF4EE 100%); color: var(--sr-ink); border-bottom: 1px solid var(--sr-line); }
.srs-hero::before { content:''; position:absolute; inset:0; pointer-events:none; background:
    radial-gradient(circle at 90% 8%, rgba(244, 73, 2,.10), transparent 42%),
    radial-gradient(circle at 6% 95%, rgba(244, 73, 2,.05), transparent 40%); }
.srs-hero-grid { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: 50px; align-items: center; padding: 76px 0 86px; }
.srs-hero h1 { font-size: clamp(34px, 5.2vw, 58px); font-weight: 800; line-height: 1.04; letter-spacing: -1px; margin: 0 0 20px; color: var(--sr-ink); }
.srs-hero h1 .hl { color: var(--sr-orange); }
.srs-hero p { font-size: 19px; color: var(--sr-ink-2); max-width: 520px; line-height: 1.6; margin: 0 0 30px; }
.srs-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.srs-hero-stats { display: flex; gap: 30px; margin-top: 42px; flex-wrap: wrap; }
.srs-hero-stat .n { font-size: 30px; font-weight: 800; line-height: 1; color: var(--sr-ink); }
.srs-hero-stat .n span { color: var(--sr-orange); }
.srs-hero-stat .l { font-size: 13.5px; color: var(--sr-muted); margin-top: 5px; }
/* Πάνω σε σκούρο band το --sr-ink γίνεται αόρατο — δες .srs-bg-ink .srs-lead */
.srs-bg-ink .srs-hero-stat .n { color: #fff; }
.srs-bg-ink .srs-hero-stat .l { color: #ddd2ca; }
.srs-hero-card { position: relative; }
.srs-hero-img { width: 100%; height: 440px; object-fit: cover; border-radius: 22px; box-shadow: 0 30px 60px -20px rgba(0,0,0,.5); }
.srs-hero-badge {
    position: absolute; left: -22px; bottom: 30px; background: #fff; color: var(--sr-ink);
    border-radius: 16px; padding: 16px 20px; box-shadow: 0 20px 40px -16px rgba(0,0,0,.4); display: flex; align-items: center; gap: 13px;
}
.srs-hero-badge i { width: 44px; height: 44px; border-radius: 12px; background: var(--sr-blue-soft); color: var(--sr-blue); display: grid; place-items: center; font-size: 19px; }
.srs-hero-badge .t { font-size: 12px; color: var(--sr-muted); }
.srs-hero-badge .v { font-size: 17px; font-weight: 800; }

/* ── Quick search bar ── */
.srs-searchbar {
    background: #fff; border-radius: 18px; box-shadow: var(--sr-shadow);
    padding: 16px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px;
    max-width: 880px; margin: -42px auto 0; position: relative; z-index: 5;
}
.srs-searchbar .f { display: flex; flex-direction: column; gap: 4px; padding: 4px 10px; }
.srs-searchbar label { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--sr-muted); }
.srs-searchbar select { border: 0; font-size: 15px; font-weight: 600; color: var(--sr-ink); background: transparent; padding: 2px 0; cursor: pointer; }

/* ── Feature grid ── */
/* Flex αντί για grid ώστε η τελευταία σειρά να κεντράρεται όταν οι παροχές δεν
   είναι ακριβώς πολλαπλάσιο του 4 (τώρα είναι 9). */
.srs-features { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.srs-features > * { flex: 1 1 220px; max-width: calc(25% - 15px); }
.srs-feature { background: #fff; border: 1px solid var(--sr-line); border-radius: 16px; padding: 26px 22px; transition: .2s; }
.srs-feature:hover { transform: translateY(-4px); box-shadow: var(--sr-shadow); border-color: var(--sr-light-blue); }
.srs-feature .ico { width: 52px; height: 52px; border-radius: 14px; background: var(--sr-blue-soft); color: var(--sr-blue); display: grid; place-items: center; font-size: 22px; margin-bottom: 16px; }
.srs-feature h3 { font-size: 17px; font-weight: 700; margin: 0 0 7px; }
.srs-feature p { font-size: 14px; color: var(--sr-muted); margin: 0; line-height: 1.55; }

/* ── Steps ── */
.srs-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; counter-reset: step; }
.srs-step { position: relative; padding-top: 14px; }
.srs-step .num { font-family: 'Bebas Neue', sans-serif; font-size: 56px; line-height: 1; color: var(--sr-light-blue); opacity: .55; }
.srs-step h3 { font-size: 19px; font-weight: 700; margin: 8px 0 8px; }
.srs-step p { font-size: 14.5px; color: var(--sr-muted); margin: 0; line-height: 1.55; }
/* ΤΖ 28/08/2026 §13 — τα βήματα «Βρες τον χώρο σου» και «Επισκέψου τον χώρο»
   έχουν δικό τους CTA (χώροι / online ραντεβού). */
.srs-step-cta { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 14px;
                font-weight: 700; color: var(--sr-orange); text-decoration: none; }
.srs-step-cta:hover { text-decoration: underline; }
.srs-step-cta i { font-size: 12px; transition: transform .15s; }
.srs-step-cta:hover i { transform: translateX(3px); }

/* ── Pricing table ── */
.srs-pricing-wrap { overflow-x: auto; border-radius: 18px; border: 1px solid var(--sr-line); background: #fff; box-shadow: var(--sr-shadow-sm); }
.srs-pricing { width: 100%; border-collapse: collapse; min-width: 720px; }
.srs-pricing th, .srs-pricing td { padding: 16px 18px; text-align: center; border-bottom: 1px solid var(--sr-line); }
.srs-pricing thead th { background: var(--sr-ink); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .02em; }
.srs-pricing thead th:first-child { text-align: left; border-top-left-radius: 0; }
.srs-pricing tbody td:first-child { text-align: left; font-weight: 800; font-size: 16px; color: var(--sr-ink); }
.srs-pricing tbody tr:hover { background: var(--sr-blue-soft); }
.srs-pricing .best { color: var(--sr-blue); font-weight: 800; font-size: 17px; }
.srs-pricing .muted { color: var(--sr-muted); }
.srs-pricing-note { font-size: 14px; color: var(--sr-muted); margin-top: 16px; display: flex; align-items: center; gap: 9px; }
.srs-pricing-note i { color: var(--sr-blue); }

/* ── Price calculator (home) ── */
.srs-calc { display: grid; grid-template-columns: 1.35fr 1fr; gap: 0; background: #fff;
            border: 1px solid var(--sr-line); border-radius: 22px; overflow: hidden; box-shadow: var(--sr-shadow); }
.srs-calc-panel { padding: 34px 34px 30px; }
.srs-calc-field + .srs-calc-field { margin-top: 30px; }
.srs-calc-label { display: block; font-size: 13px; font-weight: 700; text-transform: uppercase;
                  letter-spacing: .05em; color: var(--sr-muted); margin-bottom: 14px; }

.srs-calc-readout { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.srs-calc-readout b { font-size: 42px; font-weight: 800; line-height: 1; color: var(--sr-ink); letter-spacing: -1px; }
.srs-calc-vol { font-size: 16px; font-weight: 700; color: var(--sr-orange);
                background: var(--sr-orange-soft); padding: 6px 13px; border-radius: 30px; }

.srs-calc-range { --srs-fill: 50%; width: 100%; height: 8px; border-radius: 20px; appearance: none; -webkit-appearance: none;
                  background: linear-gradient(to right, var(--sr-orange) var(--srs-fill), var(--sr-line) var(--srs-fill));
                  cursor: pointer; outline: none; }
.srs-calc-range::-webkit-slider-thumb { -webkit-appearance: none; width: 26px; height: 26px; border-radius: 50%;
                  background: #fff; border: 4px solid var(--sr-orange); box-shadow: var(--sr-shadow-sm); cursor: grab; }
.srs-calc-range::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff;
                  border: 4px solid var(--sr-orange); box-shadow: var(--sr-shadow-sm); cursor: grab; }
.srs-calc-range:focus-visible { outline: 3px solid var(--sr-orange-soft); outline-offset: 3px; }
.srs-calc-scale { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--sr-muted); margin-top: 8px; }

.srs-calc-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.srs-calc-chip { border: 1px solid var(--sr-line); background: #fff; color: var(--sr-ink-2); font-size: 13px;
                 font-weight: 700; padding: 7px 14px; border-radius: 30px; cursor: pointer; transition: .15s; }
.srs-calc-chip:hover { border-color: var(--sr-orange); color: var(--sr-orange); background: var(--sr-orange-soft); }
/* ΤΖ 28/08/2026 §6 — τα κουμπιά μεγέθους είναι πλέον ο ΜΟΝΟΣ τρόπος επιλογής,
   άρα πρέπει να φαίνεται καθαρά ποιο είναι πατημένο. Μεγαλύτερα σε κινητό. */
.srs-calc-chip.is-active { border-color: var(--sr-orange); background: var(--sr-orange); color: #fff; }
.srs-calc-chip:focus-visible { outline: 3px solid var(--sr-orange-soft); outline-offset: 2px; }
@media (max-width: 640px) {
    .srs-calc-presets { gap: 10px; }
    .srs-calc-chip { padding: 12px 18px; font-size: 15px; }
}

.srs-calc-seg { display: flex; gap: 8px; background: var(--sr-blue-soft); padding: 6px; border-radius: 14px; }
.srs-calc-segbtn { flex: 1; border: 0; background: transparent; font-size: 14px; font-weight: 700; color: var(--sr-ink-2);
                   padding: 11px 8px; border-radius: 10px; cursor: pointer; transition: .15s; }
.srs-calc-segbtn:hover { color: var(--sr-orange); }
.srs-calc-segbtn.is-active { background: #fff; color: var(--sr-orange); box-shadow: var(--sr-shadow-sm); }

.srs-calc-segbtn i { margin-right: 6px; }
.srs-calc-segbtn small { font-weight: 600; opacity: .75; }

/* Τρόπος πληρωμής — δύο ευδιάκριτες κάρτες με την τιμή της κάθε επιλογής. */
.srs-calc-pay { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.srs-calc-payopt { position: relative; text-align: left; border: 2px solid var(--sr-line); background: #fff;
                   border-radius: 15px; padding: 15px 16px 14px; cursor: pointer; transition: .16s;
                   display: flex; flex-direction: column; gap: 4px; }
.srs-calc-payopt:hover:not(.is-disabled) { border-color: var(--sr-orange); background: var(--sr-orange-soft); }
.srs-calc-payopt.is-active { border-color: var(--sr-orange); background: var(--sr-orange-soft);
                             box-shadow: 0 0 0 4px rgba(244,73,2,.12); }
.srs-calc-payopt.is-disabled { opacity: .5; cursor: not-allowed; }
.srs-calc-payopt .hd { font-size: 14px; font-weight: 800; color: var(--sr-ink); line-height: 1.3; }
.srs-calc-payopt .hd i { color: var(--sr-orange); margin-right: 6px; }
.srs-calc-payopt .pr { font-size: 21px; font-weight: 800; color: var(--sr-ink); letter-spacing: -.5px; }
.srs-calc-payopt.is-active .pr { color: var(--sr-orange); }
.srs-calc-payopt .sb { font-size: 12.5px; color: var(--sr-muted); line-height: 1.4; }
.srs-calc-payopt .tag { position: absolute; top: -10px; right: 12px; background: var(--sr-orange); color: #fff;
                        font-size: 11px; font-weight: 800; padding: 3px 9px; border-radius: 20px;
                        text-transform: uppercase; letter-spacing: .03em; }
.srs-calc-payhint { display: flex; gap: 8px; font-size: 13px; color: var(--sr-muted); margin: 12px 0 0; }
.srs-calc-payhint i { color: var(--sr-orange); margin-top: 3px; }

.srs-calc-vatnote { font-size: 13px; color: var(--sr-muted); margin: 12px 0 0; line-height: 1.55; }
.srs-calc-pricenote { font-size: 13.5px; color: #f0cdba; margin: -16px 0 22px; }

.srs-calc-note { font-size: 13px; color: var(--sr-muted); margin: 26px 0 0; display: flex; gap: 9px; line-height: 1.55; }
.srs-calc-note i { color: var(--sr-orange); margin-top: 3px; }

.srs-calc-result { background: linear-gradient(165deg, #231F20 0%, #3a2a20 100%); color: #fff;
                   padding: 34px 30px; display: flex; flex-direction: column; }
/* No uppercase here — it would render the "m²" unit as "M²". */
.srs-calc-tier { font-size: 13px; font-weight: 700; letter-spacing: .02em; color: #f0cdba; margin-bottom: 14px; }
.srs-calc-price { display: flex; align-items: baseline; gap: 3px; margin-bottom: 24px; }
.srs-calc-price .cur { font-size: 30px; font-weight: 700; color: var(--sr-orange); }
.srs-calc-price #srCalcMonthly { font-size: 58px; font-weight: 800; line-height: 1; letter-spacing: -2px; color: #fff; }
.srs-calc-price small { font-size: 15px; color: #c9bdb6; margin-left: 6px; }
/* ΤΖ 28/08/2026 §5 — όσο δεν έχει επιλεγεί μέγεθος δείχνουμε παύλα, όχι €0.
   Η παύλα γράφεται πιο διακριτικά ώστε να μη διαβάζεται ως τιμή. */
.srs-calc-price.is-empty .cur,
.srs-calc-price.is-empty small { opacity: .45; }
.srs-calc-price.is-empty #srCalcMonthly { color: #c9bdb6; letter-spacing: 0; }

.srs-calc-rows { border-top: 1px solid rgba(255,255,255,.14); }
.srs-calc-row { display: flex; justify-content: space-between; align-items: center; gap: 12px;
                padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 14px; color: #c9bdb6; }
.srs-calc-row b { color: #fff; font-weight: 700; text-align: right; }

.srs-calc-save { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 18px;
                 background: rgba(244,73,2,.16); border: 1px solid rgba(244,73,2,.4); color: #ffd9c6;
                 padding: 12px 15px; border-radius: 12px; font-size: 13.5px; }
.srs-calc-save i { color: var(--sr-orange); }
.srs-calc-save b { color: #fff; font-weight: 800; }

.srs-calc-cta { margin-top: auto; padding-top: 0; }
.srs-calc-result .srs-calc-cta { margin-top: 24px; justify-content: center; width: 100%; }
.srs-calc-mezz { margin-top: 16px; font-size: 13px; color: #c9bdb6; text-align: center; }
.srs-calc-mezz a { color: var(--sr-orange); font-weight: 700; }

@media (max-width: 900px) {
    .srs-calc { grid-template-columns: 1fr; }
    .srs-calc-pay { grid-template-columns: 1fr; }
    .srs-calc-payopt .tag { top: -10px; right: 10px; }
    .srs-calc-panel { padding: 26px 22px 24px; }
    .srs-calc-result { padding: 28px 22px; }
    .srs-calc-readout b { font-size: 34px; }
    .srs-calc-price #srCalcMonthly { font-size: 48px; }
}

/* ── Location cards ── */
.srs-locs { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.srs-loc-card { background: #fff; border: 1px solid var(--sr-line); border-radius: 20px; overflow: hidden; box-shadow: var(--sr-shadow-sm); transition: .2s; display: flex; flex-direction: column; }
.srs-loc-card:hover { box-shadow: var(--sr-shadow); transform: translateY(-3px); }
.srs-loc-card .ph { height: 220px; position: relative; overflow: hidden; }
.srs-loc-card .ph img { width: 100%; height: 100%; object-fit: cover; transition: .4s; }
.srs-loc-card:hover .ph img { transform: scale(1.06); }
.srs-loc-card .ph .chip { position: absolute; top: 14px; left: 14px; background: rgba(255,255,255,.92); color: var(--sr-blue-dark); font-size: 12.5px; font-weight: 700; padding: 6px 13px; border-radius: 20px; }
.srs-loc-card .bd { padding: 22px 24px 24px; flex: 1; display: flex; flex-direction: column; }
.srs-loc-card h3 { font-size: 21px; font-weight: 800; margin: 0 0 6px; }
.srs-loc-card .addr { font-size: 14px; color: var(--sr-muted); margin: 0 0 16px; display: flex; align-items: center; gap: 8px; }
.srs-loc-card .meta { display: flex; gap: 18px; margin-bottom: 18px; }
.srs-loc-card .meta .it { font-size: 13px; color: var(--sr-ink-2); display: flex; align-items: center; gap: 7px; }
.srs-loc-card .meta i { color: var(--sr-blue); }
.srs-loc-card .ft { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.srs-loc-card .from { font-size: 13px; color: var(--sr-muted); }
.srs-loc-card .from b { font-size: 22px; color: var(--sr-blue); }

/* ── Use cases ── */
.srs-usecases { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.srs-usecases > div { transition: .2s; }
.srs-usecases > div:hover { transform: translateY(-4px); box-shadow: var(--sr-shadow); }
@media (max-width: 992px) { .srs-usecases { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .srs-usecases { grid-template-columns: 1fr; } }

/* ── Gallery ── */
.srs-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.srs-gallery a { display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 4/3; }
.srs-gallery img { width: 100%; height: 100%; object-fit: cover; transition: .35s; }
.srs-gallery a:hover img { transform: scale(1.08); }
.srs-gallery .tall { grid-row: span 2; aspect-ratio: auto; }

/* ── Items lists (allowed / prohibited) ── */
.srs-items { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.srs-items-card { background: #fff; border: 1px solid var(--sr-line); border-radius: 18px; padding: 28px; }
.srs-items-card h3 { font-size: 19px; font-weight: 800; margin: 0 0 18px; display: flex; align-items: center; gap: 11px; }
.srs-items-card.ok h3 i { color: #16a34a; }
.srs-items-card.no h3 i { color: #dc2626; }
.srs-items-card ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.srs-items-card li { font-size: 14.5px; color: var(--sr-ink-2); display: flex; align-items: center; gap: 9px; }
.srs-items-card.ok li::before { content: '\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900; color: #16a34a; font-size: 12px; }
.srs-items-card.no li::before { content: '\f00d'; font-family: 'Font Awesome 6 Free'; font-weight: 900; color: #dc2626; font-size: 13px; }
/* ΤΖ 28/08/2026 §17 — στη Home δείχνουμε λίγα παραδείγματα· ο πλήρης κατάλογος
   μένει στους Όρους και ο επισκέπτης πάει εκεί με το CTA από κάτω. */
.srs-items-more { font-size: 13.5px; color: var(--sr-muted); font-style: italic; margin: 16px 0 0; }

/* ── FAQ accordion ── */
.srs-faq { max-width: 820px; margin: 0 auto; }
.srs-faq details { background: #fff; border: 1px solid var(--sr-line); border-radius: 14px; margin-bottom: 12px; overflow: hidden; }
.srs-faq summary { padding: 19px 22px; font-size: 16.5px; font-weight: 700; cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.srs-faq summary::-webkit-details-marker { display: none; }
.srs-faq summary::after { content: '\2b'; color: var(--sr-blue); font-weight: 700; font-size: 20px; transition: .2s; }
.srs-faq details[open] summary::after { transform: rotate(45deg); }
.srs-faq .a { padding: 0 22px 20px; color: var(--sr-muted); font-size: 15px; line-height: 1.6; }
.srs-faq-list { margin: 10px 0 0; padding-left: 20px; }
.srs-faq-list li { margin-bottom: 5px; }

/* ── Reviews ── */
.srs-reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.srs-review { background: #fff; border: 1px solid var(--sr-line); border-radius: 18px; padding: 26px; box-shadow: var(--sr-shadow-sm); }
.srs-review .stars { color: #f6b73c; margin-bottom: 13px; font-size: 15px; }
.srs-review p { font-size: 15px; line-height: 1.6; color: var(--sr-ink-2); margin: 0 0 18px; }
.srs-review .who { display: flex; align-items: center; gap: 11px; }
.srs-review .av { width: 42px; height: 42px; border-radius: 50%; background: var(--sr-blue); color: #fff; font-weight: 700; display: grid; place-items: center; }
.srs-review .av-img { object-fit: cover; background: var(--sr-line); }
.srs-review .who b { font-size: 14.5px; }
.srs-review .who span { font-size: 12.5px; color: var(--sr-muted); display: block; }
.srs-review .who span i { color: #4285F4; margin-right: 4px; }
/* Συνολική βαθμολογία Google */
.srs-gscore { display: inline-flex; align-items: center; gap: 10px; margin-top: 16px; background: #fff;
              border: 1px solid var(--sr-line); border-radius: 40px; padding: 9px 18px; box-shadow: var(--sr-shadow-sm); }
.srs-gscore b { font-size: 20px; font-weight: 800; color: var(--sr-ink); }
.srs-gscore .stars { color: #f6b73c; font-size: 14px; }
.srs-gscore .stars .off { color: var(--sr-line); }
.srs-gscore .cnt { font-size: 13px; color: var(--sr-muted); }

/* ── CTA band ── */
.srs-cta { background: linear-gradient(140deg, #231F20, #C93A02 110%); border-radius: 26px; padding: 56px; text-align: center; color: #fff; position: relative; overflow: hidden; }
.srs-cta::after { content:''; position:absolute; right:-80px; top:-80px; width:280px; height:280px; border-radius:50%; background: rgba(244, 73, 2,.18); }
.srs-cta h2 { font-size: clamp(26px, 3.5vw, 38px); font-weight: 800; margin: 0 0 14px; position: relative; }
.srs-cta p { font-size: 18px; color: #f5dccf; max-width: 560px; margin: 0 auto 28px; position: relative; }
.srs-cta-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; position: relative; }

/* ── Buttons (site scale) ── */
.srs-btn { display: inline-flex; align-items: center; gap: 9px; font-size: 15.5px; font-weight: 700; padding: 14px 26px; border-radius: 12px; border: 2px solid transparent; text-decoration: none; cursor: pointer; transition: .16s; }
.srs-btn-primary { background: var(--sr-blue); color: #fff; border-color: var(--sr-blue); }
.srs-btn-primary:hover { background: var(--sr-blue-dark); border-color: var(--sr-blue-dark); color: #fff; transform: translateY(-2px); }
.srs-btn-light { background: #fff; color: var(--sr-ink); border-color: #fff; }
.srs-btn-light:hover { background: transparent; color: #fff; }
.srs-btn-outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.srs-btn-outline:hover { border-color: #fff; background: rgba(255,255,255,.1); color: #fff; }
.srs-btn-ghost { background: #fff; color: var(--sr-ink); border-color: var(--sr-line); }
.srs-btn-ghost:hover { border-color: var(--sr-blue); color: var(--sr-blue); }

/* ── Page header (inner pages) ── */
.srs-pagehead { background: linear-gradient(150deg, #231F20, #C93A02); color: #fff; padding: 64px 0 56px; position: relative; overflow: hidden; }
.srs-pagehead::after { content:''; position:absolute; right:-60px; bottom:-90px; width:260px; height:260px; border-radius:50%; background: rgba(244, 73, 2,.16); }
.srs-pagehead .crumb { font-size: 13.5px; color: #e8bfa6; margin-bottom: 12px; position: relative; }
.srs-pagehead .crumb a { color: #f5dccf; text-decoration: none; }
.srs-pagehead h1 { font-size: clamp(30px, 4.5vw, 46px); font-weight: 800; margin: 0 0 12px; letter-spacing: -.5px; position: relative; }
.srs-pagehead p { font-size: 18px; color: #f5dccf; max-width: 640px; margin: 0; position: relative; }

/* Prose (about / terms) */
.srs-prose { max-width: 820px; margin: 0 auto; font-size: 16px; line-height: 1.75; color: var(--sr-ink-2); }
.srs-prose h2 { font-size: 26px; font-weight: 800; color: var(--sr-ink); margin: 38px 0 14px; }
.srs-prose h3 { font-size: 20px; font-weight: 700; color: var(--sr-ink); margin: 28px 0 10px; }
.srs-prose p { margin: 0 0 16px; }
.srs-prose ul { margin: 0 0 16px; padding-left: 22px; }
.srs-prose li { margin-bottom: 8px; }
.srs-prose a { color: var(--sr-blue); }

/* Utility */
.srs-mt-6 { margin-top: 40px; }
.srs-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 42px; flex-wrap: wrap; }

@media (max-width: 992px) {
    .srs-hero-grid { grid-template-columns: 1fr; gap: 30px; padding: 60px 0 70px; }
    .srs-hero-card { display: none; }
    .srs-features > * { max-width: calc(50% - 10px); }
    .srs-steps { grid-template-columns: 1fr 1fr; }
    .srs-locs { grid-template-columns: 1fr; }
    .srs-reviews { grid-template-columns: 1fr; }
    .srs-gallery { grid-template-columns: 1fr 1fr; }
    .srs-items { grid-template-columns: 1fr; }
    .srs-searchbar { grid-template-columns: 1fr; }
    .srs-cta { padding: 40px 24px; }
}
@media (max-width: 560px) {
    .srs-features > * { max-width: 100%; }
    .srs-steps { grid-template-columns: 1fr; }
    .srs-items-card ul { grid-template-columns: 1fr; }
}

/* ── Mobile scroll hint for the pricing table ── */
.srs-scroll-hint {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--sr-blue);
    margin-bottom: 12px;
}
.srs-scroll-hint i { animation: srsHintSlide 1.4s ease-in-out infinite; }
@keyframes srsHintSlide { 0%,100% { transform: translateX(-3px); } 50% { transform: translateX(3px); } }
/* right-edge fade so it reads as scrollable */
.srs-scroll-x { position: relative; }
@media (max-width: 768px) {
    .srs-scroll-hint { display: flex; }
    .srs-scroll-x { -webkit-overflow-scrolling: touch; }
    .srs-scroll-x::-webkit-scrollbar { height: 7px; }
    .srs-scroll-x::-webkit-scrollbar-thumb { background: rgba(244,73,2,.4); border-radius: 4px; }
}

/* ── Home locations map (multi-marker) ── */
.srs-map-wrap {
    margin-top: 34px;
}
.srs-map {
    width: 100%;
    height: 420px;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px -22px rgba(35, 31, 32, .5);
    border: 1px solid rgba(35, 31, 32, .08);
}
@media (max-width: 768px) {
    .srs-map { height: 320px; border-radius: 14px; }
    .srs-map-wrap { margin-top: 24px; }
}

/* ── Mobile footer: left-align & balance (theme forces center < 993px) ── */
@media (max-width: 993px) {
    footer .d-flex.flex-column {
        text-align: left;
        align-items: flex-start;
        justify-content: flex-start;
    }
    footer .list,
    footer .list li,
    footer .link.d-flex.flex-row {
        text-align: left;
        align-items: flex-start;
        justify-content: flex-start;
    }
    footer .list { padding-inline: 0; }
    /* keep icon boxes next to their text, top-aligned */
    footer .list li > .d-flex { align-items: flex-start; }
    /* copyright stays centered */
    footer .justify-content-center {
        justify-content: center !important;
        text-align: center;
        align-items: center;
    }
}


/* ═══════════════════════════════════════════════════════════════════════
   ΤΖ 28/08/2026 — ΛΙΣΤΑ ΑΝΑΜΟΝΗΣ (§8) & GALLERY / LIGHTBOX (§16)
   ═══════════════════════════════════════════════════════════════════════ */

/* ── §8 Μήνυμα «δεν υπάρχει διαθέσιμος χώρος» ── */
.wl-empty { background: #fff; border: 1px solid var(--sr-line); border-radius: 18px;
            padding: 34px 30px; text-align: center; }
.wl-empty.is-compact { padding: 24px 22px; }
.wl-empty-ic { width: 54px; height: 54px; margin: 0 auto 16px; border-radius: 50%;
               background: var(--sr-orange-soft); color: var(--sr-orange);
               display: flex; align-items: center; justify-content: center; font-size: 22px; }
.wl-empty h3 { font-size: 19px; font-weight: 800; margin: 0 0 10px; color: var(--sr-ink); }
.wl-empty p { font-size: 14.5px; color: var(--sr-muted); margin: 0 auto 22px; max-width: 520px; line-height: 1.6; }
.wl-empty-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ── §8.2 Ευχαριστήριο μετά την υποβολή ── */
.wl-thanks { display: flex; gap: 16px; align-items: flex-start; background: #e6f6ec;
             border: 1px solid #b7e4c7; border-radius: 16px; padding: 20px 22px; margin-bottom: 26px; }
.wl-thanks-ic { color: #15803d; font-size: 22px; line-height: 1.2; }
.wl-thanks-msg { margin: 0 0 14px; font-size: 15px; color: #14532d; line-height: 1.6; }

/* ── §8.1 Modal ── */
.wl-modal { position: fixed; inset: 0; z-index: 1080; display: flex;
            align-items: center; justify-content: center; padding: 20px; }
.wl-modal[hidden] { display: none; }
.wl-modal-backdrop { position: absolute; inset: 0; background: rgba(29, 26, 27, .62); }
.wl-modal-card { position: relative; background: #fff; border-radius: 20px; padding: 30px 28px;
                 width: 100%; max-width: 440px; max-height: 92vh; overflow-y: auto;
                 box-shadow: 0 24px 60px rgba(0, 0, 0, .3); }
.wl-modal-card h3 { font-size: 21px; font-weight: 800; margin: 0 0 8px; padding-right: 30px; }
.wl-modal-sub { font-size: 14px; color: var(--sr-muted); margin: 0 0 14px; line-height: 1.6; }
.wl-modal-loc { font-size: 14px; font-weight: 700; color: var(--sr-orange);
                background: var(--sr-orange-soft); border-radius: 10px; padding: 9px 13px; margin: 0 0 20px; }
.wl-modal-x { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 0;
              border-radius: 50%; background: var(--sr-blue-soft); color: var(--sr-ink-2);
              font-size: 15px; cursor: pointer; }
.wl-modal-x:hover { background: var(--sr-orange-soft); color: var(--sr-orange); }
.wl-modal .sr-field { margin-bottom: 14px; }

/* ── §16 Lightbox ── */
.sr-lb { position: fixed; inset: 0; z-index: 1090; background: rgba(15, 13, 14, .93);
         display: flex; align-items: center; justify-content: center; flex-direction: column; }
.sr-lb[hidden] { display: none; }
.sr-lb-stage { margin: 0; max-width: 92vw; max-height: 76vh; display: flex;
               align-items: center; justify-content: center; }
.sr-lb-stage img { max-width: 92vw; max-height: 76vh; border-radius: 10px;
                   box-shadow: 0 20px 50px rgba(0, 0, 0, .5); display: block; }
.sr-lb-x { position: absolute; top: 18px; right: 18px; width: 46px; height: 46px; border: 0;
           border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; font-size: 19px;
           cursor: pointer; transition: .15s; }
.sr-lb-x:hover { background: var(--sr-orange); }
.sr-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px;
             border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff;
             font-size: 20px; cursor: pointer; transition: .15s; }
.sr-lb-nav:hover { background: var(--sr-orange); }
.sr-lb-nav.prev { left: 20px; }
.sr-lb-nav.next { right: 20px; }
.sr-lb-count { margin-top: 18px; color: #fff; font-size: 14px; font-weight: 700; letter-spacing: 1px; }
.sr-lb-thumbs { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap;
                justify-content: center; max-width: 92vw; }
.sr-lb-thumb { width: 54px; height: 40px; border-radius: 6px; border: 2px solid transparent;
               background-size: cover; background-position: center; cursor: pointer; opacity: .55;
               transition: .15s; padding: 0; }
.sr-lb-thumb:hover { opacity: 1; }
.sr-lb-thumb.is-active { opacity: 1; border-color: var(--sr-orange); }

/* Οι φωτογραφίες της gallery είναι πλέον κουμπιά lightbox, όχι links σε νέα καρτέλα. */
.srs-gallery a { cursor: zoom-in; }

@media (max-width: 640px) {
    /* §16.2 — σε κινητό η πλοήγηση γίνεται με swipe· τα βέλη μικραίνουν και
       μπαίνουν χαμηλά, ώστε να μην κρύβουν τη φωτογραφία. */
    .sr-lb-nav { width: 42px; height: 42px; font-size: 16px; top: auto; bottom: 22px; transform: none; }
    .sr-lb-nav.prev { left: 24px; }
    .sr-lb-nav.next { right: 24px; }
    .sr-lb-stage, .sr-lb-stage img { max-height: 62vh; }
    .sr-lb-thumbs { display: none; }
    .wl-empty-cta .sr-btn { width: 100%; }
    .wl-modal-card { padding: 26px 20px; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ΤΖ 28/08/2026 §14 — ONLINE ΡΑΝΤΕΒΟΥ ΕΠΙΣΚΕΨΗΣ
   ═══════════════════════════════════════════════════════════════════════ */

.ap-form { max-width: 760px; margin: 0 auto; }
.ap-step { background: #fff; border: 1px solid var(--sr-line); border-radius: 18px;
           padding: 26px 26px 28px; margin-bottom: 18px; }
.ap-step-head { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.ap-step-num { width: 30px; height: 30px; border-radius: 50%; background: var(--sr-orange);
               color: #fff; font-weight: 800; font-size: 15px; display: grid; place-items: center; flex-shrink: 0; }
.ap-step-head h2 { font-size: 18px; font-weight: 800; margin: 0; }
.ap-hint { font-size: 14px; color: var(--sr-muted); margin: 0; }

/* Τοποθεσίες */
.ap-locs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.ap-loc { display: block; border: 2px solid var(--sr-line); border-radius: 14px; padding: 15px 16px;
          cursor: pointer; transition: .15s; }
.ap-loc:hover { border-color: var(--sr-light-blue); }
.ap-loc.is-active { border-color: var(--sr-orange); background: var(--sr-orange-soft); }
.ap-loc input { position: absolute; opacity: 0; pointer-events: none; }
.ap-loc-name { display: block; font-size: 15px; font-weight: 800; color: var(--sr-ink); margin-bottom: 4px; }
.ap-loc-addr { display: block; font-size: 12.5px; color: var(--sr-muted); line-height: 1.5; }

/* Ημέρες — οριζόντια λίστα που κυλάει σε κινητό */
.ap-days { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; }
.ap-day { flex: 0 0 auto; width: 78px; border: 2px solid var(--sr-line); background: #fff;
          border-radius: 14px; padding: 11px 6px; cursor: pointer; text-align: center; transition: .15s; }
.ap-day:hover { border-color: var(--sr-light-blue); }
.ap-day.is-active { border-color: var(--sr-orange); background: var(--sr-orange); color: #fff; }
.ap-day .dow { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em;
               color: var(--sr-muted); margin-bottom: 3px; }
.ap-day.is-active .dow { color: rgba(255,255,255,.85); }
.ap-day .dnum { display: block; font-size: 16px; font-weight: 800; }
.ap-day .dcount { display: block; font-size: 11px; color: var(--sr-muted); margin-top: 3px; }
.ap-day.is-active .dcount { color: rgba(255,255,255,.85); }

/* Ώρες — τα slots των 30 λεπτών */
.ap-slots { display: flex; flex-wrap: wrap; gap: 9px; }
.ap-slot { border: 2px solid var(--sr-line); background: #fff; color: var(--sr-ink-2);
           border-radius: 10px; padding: 10px 15px; font-size: 14.5px; font-weight: 700;
           cursor: pointer; transition: .15s; }
.ap-slot:hover { border-color: var(--sr-orange); color: var(--sr-orange); }
.ap-slot.is-active { border-color: var(--sr-orange); background: var(--sr-orange); color: #fff; }

/* Σύνοψη πριν την υποβολή */
.ap-summary { display: flex; align-items: center; gap: 11px; background: var(--sr-blue-soft);
              border-radius: 14px; padding: 15px 18px; margin-bottom: 14px;
              font-size: 15px; font-weight: 700; color: var(--sr-ink); }
.ap-summary i { color: var(--sr-orange); font-size: 18px; }
.ap-phone-note { text-align: center; font-size: 14px; color: var(--sr-muted); margin-top: 18px; }
.ap-phone-note a { color: var(--sr-orange); font-weight: 700; }

/* Μηνύματα */
.ap-alert { display: flex; gap: 13px; align-items: flex-start; border-radius: 14px;
            padding: 16px 18px; margin-bottom: 20px; font-size: 14.5px; line-height: 1.6; }
.ap-alert.is-error { background: #fdecec; border: 1px solid #f5c2c2; color: #991b1b; }
.ap-alert.is-ok { background: #e6f6ec; border: 1px solid #b7e4c7; color: #14532d; }

/* Σελίδα επιβεβαίωσης / διαχείρισης */
.ap-card { background: #fff; border: 1px solid var(--sr-line); border-radius: 20px;
           padding: 30px 28px; margin-bottom: 18px; }
.ap-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800;
            letter-spacing: .04em; background: #e6f6ec; color: #15803d; border-radius: 30px;
            padding: 7px 15px; margin-bottom: 14px; }
.ap-badge.is-cancelled { background: #f1f0ef; color: var(--sr-muted); }
.ap-card-title { font-size: clamp(22px, 3.4vw, 30px); font-weight: 800; margin: 0 0 10px; line-height: 1.15; }
.ap-card-h2 { font-size: 19px; font-weight: 800; margin: 0 0 8px; }
.ap-card-sub { font-size: 15px; color: var(--sr-muted); line-height: 1.6; margin: 0 0 20px; }
.ap-details { display: grid; gap: 2px; margin-bottom: 20px; }
.ap-detail { border-bottom: 1px solid var(--sr-line); padding: 11px 0; }
.ap-detail .lbl { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em;
                  color: var(--sr-muted); margin-bottom: 3px; }
.ap-detail .val { font-size: 15px; font-weight: 700; color: var(--sr-ink); }
.ap-cancel { display: block; width: 100%; background: none; border: 0; color: #b91c1c;
             font-size: 14px; font-weight: 700; padding: 12px; cursor: pointer; }
.ap-cancel:hover { text-decoration: underline; }

@media (max-width: 780px) {
    .ap-locs { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .ap-step { padding: 20px 18px 22px; }
    /* Σε κινητό τα slots γίνονται πλέγμα: πιο εύκολα στο δάχτυλο από τη σειρά. */
    .ap-slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .ap-slot { padding: 13px 6px; text-align: center; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ΤΖ 28/08/2026 §12 — «Σχετικά με εμάς» (τοποθεσίες + γιατί StorageRooms)
   ═══════════════════════════════════════════════════════════════════════ */

.ab-locs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ab-loc { display: flex; align-items: center; gap: 15px; background: #fff; border: 1px solid var(--sr-line);
          border-radius: 16px; padding: 20px 22px; text-decoration: none; color: inherit; transition: .18s; }
.ab-loc:hover { border-color: var(--sr-orange); box-shadow: var(--sr-shadow); transform: translateY(-3px); }
.ab-loc .ic { width: 46px; height: 46px; flex: none; border-radius: 13px; background: var(--sr-blue-soft);
              color: var(--sr-blue); display: grid; place-items: center; font-size: 18px; }
.ab-loc .tx { flex: 1; min-width: 0; }
.ab-loc .tx b { display: block; font-size: 15.5px; color: var(--sr-ink); margin-bottom: 3px; }
.ab-loc .tx em { display: block; font-style: normal; font-size: 12.5px; color: var(--sr-muted); line-height: 1.5; }
.ab-loc .go { color: var(--sr-orange); font-size: 13px; transition: transform .18s; }
.ab-loc:hover .go { transform: translateX(4px); }

.ab-why { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.ab-why-card { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14);
               border-radius: 16px; padding: 26px 20px; text-align: center;
               font-size: 15.5px; font-weight: 700; color: #fff; line-height: 1.5; }
.ab-why-card i { display: block; font-size: 26px; color: var(--sr-orange); margin-bottom: 14px; }

@media (max-width: 900px) {
    .ab-locs { grid-template-columns: 1fr; }
    .ab-why { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .ab-why { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ΤΖ 28/08/2026 §3 — «Προβολή μη διαθέσιμων χώρων» (κλειστό by default)
   ═══════════════════════════════════════════════════════════════════════ */

.sr-unavailable { margin-top: 26px; }
.sr-unavailable > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 10px;
                            font-size: 14.5px; font-weight: 700; color: var(--sr-ink-2);
                            background: #fff; border: 1px solid var(--sr-line); border-radius: 30px;
                            padding: 11px 20px; transition: .15s; }
.sr-unavailable > summary::-webkit-details-marker { display: none; }
.sr-unavailable > summary:hover { border-color: var(--sr-orange); color: var(--sr-orange); }
.sr-unavailable > summary i { font-size: 12px; color: var(--sr-muted); transition: transform .18s; }
.sr-unavailable[open] > summary i { transform: rotate(180deg); }
/* Οι κλειστές αποθήκες δείχνονται πιο σβηστές — δεν είναι επιλογή, είναι πληροφορία. */
.sr-unit.is-taken { opacity: .72; }
.sr-taken-lbl { display: block; width: 100%; text-align: center; font-size: 13.5px; font-weight: 700;
                color: var(--sr-muted); background: var(--sr-blue-soft); border-radius: 10px; padding: 10px; }
.bk-visit-cta { margin-top: 14px; }

/* §14.1 — διακριτικό CTA ραντεβού κάτω από τη φόρμα επικοινωνίας */
.srs-contact-visit { margin: 18px 0 0; font-size: 14px; color: var(--sr-muted); text-align: center; }
.srs-contact-visit i { color: var(--sr-orange); margin-right: 6px; }
.srs-contact-visit a { color: var(--sr-orange); font-weight: 700; text-decoration: none; margin-left: 5px; }
.srs-contact-visit a:hover { text-decoration: underline; }