/* =============================================================================
   site.css — the 2026 redesign (Claude Design handoff "M2 page redesign",
   2026-10-03). Loaded by templates/site/head.tpl only: pages on the new layout
   (templates/site/layout.tpl) load this file and nothing else of the old theme;
   pages still on layout.tpl keep bootstrap + style.css + responsive.css.

   Sections 1–23 are the handoff's production CSS (css/m2.css) as delivered —
   keep them in step with the handoff rather than editing them in place.
   Section 0 hosts the fonts locally (the handoff asks for it), section 24 is
   what the handoff leaves to the implementation.
   One breakpoint: @media (max-width: 767.98px).
   ============================================================================= */

/* ===== 0. FONTS (local copies of Google Fonts, latin + latin-ext) ===== */
@font-face{font-family:"Crete Round";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/site/crete-round-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Crete Round";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/site/crete-round-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/site/poppins-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/site/poppins-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/site/poppins-500-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/site/poppins-500-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/site/poppins-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/site/poppins-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ===== 1. TOKENS ===== */
:root{
--purple-900:#55224e;--purple-800:#6b2b63;--purple-700:#88367d;--purple-600:#a54399;--purple-400:#c27cb8;--purple-300:#d8a9d1;--purple-200:#ead2e6;--purple-100:#f2e3f0;--purple-50:#f8eef7;
--gray-900:#2e2e2e;--gray-800:#3a3a3a;--gray-700:#484848;--gray-600:#5c5c5c;--gray-500:#6b6b6b;--gray-400:#929292;--gray-300:#c4c4c4;--gray-200:#e2e2e2;--gray-100:#efefef;--gray-50:#f7f7f7;--white:#fff;
--color-primary:var(--purple-600);--color-primary-hover:var(--purple-700);--color-primary-active:var(--purple-800);--color-primary-soft:var(--purple-50);
--color-text:var(--gray-700);--color-heading:var(--gray-800);--color-muted:var(--gray-500);--color-bg:var(--gray-50);--color-surface:var(--white);--color-border:var(--gray-200);--color-border-strong:var(--gray-400);--color-focus:var(--purple-600);
--font-heading:"Crete Round",Georgia,serif;--font-body:"Poppins",system-ui,sans-serif;
--fs-display:3.75rem;--fs-h1:2.5rem;--fs-h2:2rem;--fs-h3:1.375rem;--fs-h4:1.125rem;--fs-lg:1.125rem;--fs-base:1rem;--fs-sm:.875rem;--fs-xs:.8125rem;
--lh-tight:1.15;--lh-base:1.6;
--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;
--radius-sm:6px;--radius:10px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;
--shadow-sm:0 1px 2px rgb(46 46 46/.06);--shadow:0 1px 2px rgb(46 46 46/.06),0 6px 20px rgb(46 46 46/.08);--shadow-lg:0 16px 48px rgb(46 46 46/.18);
--container:1240px;--gutter:2rem;--header-h:72px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;-webkit-font-smoothing:antialiased}
:where(a){color:var(--color-primary)}:where(a:hover){color:var(--color-primary-hover)}
img{max-width:100%}

/* ===== 2. BASE ===== */
.site{font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-base);color:var(--color-text);background:var(--color-bg);min-height:100%}
:where(.site) :is(h1,h2,h3,h4){font-family:var(--font-heading);font-weight:400;line-height:var(--lh-tight);color:var(--color-heading);margin:0;text-wrap:balance}
.site h1{font-size:var(--fs-h1)}.site h2{font-size:var(--fs-h2)}.site h3{font-size:var(--fs-h3)}.site h4{font-size:var(--fs-h4)}
:where(.site) p{margin:0;text-wrap:pretty}
.site a{text-underline-offset:3px;text-decoration-thickness:1px}
.site :focus-visible,.is-focus{outline:3px solid var(--color-focus);outline-offset:2px}
.on-primary :focus-visible,.on-primary .is-focus{outline-color:#fff}
.container{max-width:calc(var(--container) + 2 * var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.icon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon--sm{width:16px;height:16px}.icon--lg{width:24px;height:24px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== 3. BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border:1.5px solid transparent;border-radius:var(--radius);font:500 .9375rem/1.2 var(--font-body);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.btn-primary{background:var(--color-primary);color:#fff}
.btn-primary:hover,.btn-primary.is-hover{background:var(--color-primary-hover);color:#fff}
.btn-primary:active,.btn-primary.is-active{background:var(--color-primary-active);color:#fff}
.btn-outline{background:#fff;border-color:var(--color-primary);color:var(--color-primary)}
.btn-outline:hover,.btn-outline.is-hover{background:var(--purple-50);color:var(--purple-800)}
.btn-outline:active,.btn-outline.is-active{background:var(--purple-100);color:var(--purple-800)}
.btn-ghost{background:transparent;color:var(--color-heading)}
.btn-ghost:hover,.btn-ghost.is-hover{background:var(--gray-100);color:var(--color-heading)}
.btn-ghost:active,.btn-ghost.is-active{background:var(--gray-200)}
.btn-light{background:#fff;color:var(--purple-800)}
.btn-light:hover,.btn-light.is-hover{background:var(--purple-50);color:var(--purple-900)}
.btn:disabled,.btn.is-disabled{background:var(--gray-100);border-color:var(--gray-100);color:var(--gray-500);cursor:not-allowed}
.btn-lg{min-height:56px;padding:14px 28px;font-size:1rem;border-radius:12px}
.btn-sm{min-height:36px;padding:6px 14px;font-size:.875rem}
.btn-block{width:100%}
.btn-icon{width:44px;padding:0}

/* ===== 4. FORM FIELDS ===== */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.label{font-size:.875rem;font-weight:500;color:var(--color-heading)}
.help{font-size:.8125rem;color:var(--color-muted)}
.input,.select{width:100%;height:48px;padding:0 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius);background:#fff;font:400 1rem/1.2 var(--font-body);color:var(--color-heading);transition:border-color .15s}
.input::placeholder{color:var(--gray-500);opacity:1}
.input:hover,.select:hover,.input.is-hover,.select.is-hover{border-color:var(--gray-600)}
.input:focus-visible,.select:focus-visible,.input.is-focus,.select.is-focus{outline:2px solid var(--color-focus);outline-offset:0;border-color:var(--color-focus)}
.input:disabled,.input.is-disabled{background:var(--gray-100);border-color:var(--gray-200);color:var(--gray-500)}
.input.is-invalid{border:2px solid var(--purple-800)}
.error{display:flex;gap:6px;align-items:center;font-size:.8125rem;font-weight:500;color:var(--purple-800)}
.select{appearance:none;padding-right:40px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23484848' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px}
.input-icon{position:relative;display:block}
.input-icon>.icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--gray-500);pointer-events:none}
.input-icon .input{padding-left:44px}
.input-suffix{position:relative;display:block}
.input-suffix .input{padding-right:34px}
.input-suffix__unit{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--color-muted);pointer-events:none}
.check{display:flex;gap:10px;align-items:center;min-height:44px;cursor:pointer;font-size:.9375rem;color:var(--color-heading)}
.check input{appearance:none;flex:none;width:22px;height:22px;margin:0;border:1.5px solid var(--color-border-strong);border-radius:6px;background:#fff;cursor:pointer}
.check input:checked{border-color:var(--color-primary);background:var(--color-primary) 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
.switch{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;cursor:pointer;font-size:.9375rem;color:var(--color-heading)}
.switch input{appearance:none;flex:none;position:relative;width:46px;height:28px;margin:0;border-radius:999px;background:var(--gray-400);cursor:pointer;transition:background .15s}
.switch input::before{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgb(0 0 0/.25);transition:transform .15s}
.switch input:checked{background:var(--color-primary)}
.switch input:checked::before{transform:translateX(18px)}

/* ===== 5. CHIPS, BADGES, FILTER TAGS ===== */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 16px;border:1px solid var(--gray-300);border-radius:var(--radius-pill);background:#fff;color:var(--color-heading);font:500 .875rem/1 var(--font-body);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.chip:hover,.chip.is-hover{border-color:var(--color-primary);background:var(--purple-50);color:var(--purple-800)}
.chip.is-selected,.chip-input:checked+.chip{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.chip__count{font-weight:400;color:var(--color-muted)}
.chip:hover .chip__count,.chip.is-hover .chip__count{color:var(--purple-800)}
.chip.is-selected .chip__count{color:var(--purple-50)}
.chip--on-primary{background:transparent;border-color:#fff;color:#fff}
.chip--on-primary .chip__count{color:#fff}
.chip--on-primary:hover,.chip--on-primary.is-hover{background:#fff;border-color:#fff;color:var(--purple-800)}
.chip--on-primary:hover .chip__count,.chip--on-primary.is-hover .chip__count{color:var(--purple-800)}
.chip-input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.chip-input:focus-visible+.chip{outline:3px solid var(--color-focus);outline-offset:2px}
.chip-label{display:inline-flex}
.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:var(--radius-sm);background:var(--purple-50);color:var(--purple-800);font:500 .75rem/1.2 var(--font-body);white-space:nowrap}
.badge--solid{background:var(--color-primary);color:#fff}
.badge--neutral{background:var(--gray-100);color:var(--gray-700)}
.badge--media{background:#fff;color:var(--purple-800);box-shadow:0 1px 3px rgb(0 0 0/.18)}
.filter-tag{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px 0 14px;border:1px solid var(--purple-200);border-radius:var(--radius-pill);background:var(--purple-50);color:var(--purple-800);font:500 .875rem/1 var(--font-body);text-decoration:none;white-space:nowrap;flex:none}
.filter-tag:hover,.filter-tag.is-hover{background:var(--purple-100);border-color:var(--color-primary);color:var(--purple-900)}
.link-clear{font-size:.875rem;font-weight:500;white-space:nowrap}

/* ===== 6. HEADER ===== */
.topbar{background:var(--gray-50);border-bottom:1px solid var(--color-border);font-size:.8125rem}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:24px;height:36px}
.topbar p{color:var(--color-muted)}
.topbar nav{display:flex;gap:20px}
.topbar a{color:var(--gray-600);text-decoration:none}
.topbar a:hover{color:var(--color-primary);text-decoration:underline}
.site-header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--color-border)}
.site-header .container{display:flex;align-items:center;gap:20px;height:var(--header-h)}
.logo{display:flex;align-items:center;flex:none;border-radius:6px}
.logo img{display:block;height:36px;width:auto}
.logo .logo-mark{display:none}
.main-nav{display:flex;gap:4px}
.main-nav a{display:flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--radius);color:var(--color-heading);font-weight:500;font-size:.9375rem;text-decoration:none}
.main-nav a:hover{background:var(--gray-100);color:var(--color-heading)}
.main-nav a[aria-current="page"]{color:var(--purple-800);background:var(--purple-50)}
.header-search{position:relative;flex:1;max-width:440px;margin:0 0 0 auto}
.header-search .input{height:44px;border-radius:var(--radius-pill);background:var(--gray-50)}
.header-actions{display:flex;align-items:center;gap:8px;flex:none}
.has-hero .header-search{display:none}
.has-hero .header-actions{margin-left:auto}
.menu-toggle{display:none}
.avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--purple-100);color:var(--purple-800);font-size:.8125rem;font-weight:600}
.account-btn{padding-left:8px;padding-right:12px}
.mobile-menu,.search-dialog{display:none}

/* ===== 7. SEARCH SUGGESTIONS ===== */
.suggest{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;padding:8px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);text-align:left;color:var(--color-text)}
.suggest__title{padding:8px 12px 4px;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--color-muted)}
.suggest__list{list-style:none;margin:0;padding:0}
.suggest__item{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 12px;border-radius:var(--radius);color:var(--color-heading);text-decoration:none;font-size:.9375rem}
.suggest__item:hover,.suggest__item.is-active{background:var(--purple-50);color:var(--color-heading)}
.suggest__item .icon{color:var(--gray-500)}
.suggest__label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.suggest__label mark{background:none;color:inherit;font-weight:600}
.suggest__price{font-weight:600;color:var(--color-primary);white-space:nowrap}
.suggest__price--text{color:var(--color-heading);font-weight:500}
.suggest__all{display:flex;align-items:center;justify-content:space-between;min-height:48px;margin-top:4px;padding:0 12px;border-top:1px solid var(--gray-100);font-weight:500;text-decoration:none}
.suggest__all:hover{text-decoration:underline}
.suggest__hint{padding:8px 12px 4px;font-size:.75rem;color:var(--color-muted)}

/* ===== 8. HERO ===== */
.hero{background:var(--color-primary);color:#fff;padding:80px 0 72px;text-align:center}
.site .hero h1{color:#fff;font-size:var(--fs-display);max-width:15ch;margin:0 auto}
.hero__lead{max-width:36em;margin:18px auto 0;font-size:var(--fs-lg);color:#fff}
.hero-search{position:relative;display:flex;align-items:center;gap:8px;max-width:760px;margin:36px auto 0;padding:8px;background:#fff;border-radius:18px;box-shadow:var(--shadow-lg)}
.hero-search:focus-within,.hero-search.is-focus{outline:3px solid #fff;outline-offset:3px}
.hero-search .input-icon{flex:1;min-width:0}
.hero-search .input{height:56px;border:0;padding-left:52px;font-size:1.125rem;background:transparent}
.hero-search .input:focus-visible{outline:none}
.hero-search .input-icon>.icon{left:18px;width:22px;height:22px}
.hero__chips{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;max-width:1040px;margin:24px auto 0}
.hero__chips-label{font-size:.875rem;font-weight:500;margin-right:4px}
.hero-alt{background:#fff;padding:64px 0;border-bottom:1px solid var(--color-border)}
.hero-alt .container{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.eyebrow{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary)}
.site .hero-alt h1{font-size:var(--fs-display);margin-top:12px}
.hero-alt__lead{margin-top:16px;font-size:var(--fs-lg)}
.hero-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px;padding:20px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow)}
.hero-form .field--full{grid-column:1/-1}
.hero-form__foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hero-alt .chips{margin-top:20px}
.collage{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:210px 210px;gap:12px}
.collage figure{position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--gray-200)}
.collage figure:first-child{grid-row:1/3}
.collage img{display:block;width:100%;height:100%;object-fit:cover}
.collage figcaption{position:absolute;left:10px;bottom:10px;padding:5px 10px;border-radius:999px;background:#fff;color:var(--color-heading);font-size:.8125rem;font-weight:500;box-shadow:0 1px 3px rgb(0 0 0/.18)}

/* ===== 9. SECTIONS ===== */
.section{padding:64px 0}
.section--white{background:#fff;border-block:1px solid var(--color-border)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px}
.section-head p{margin-top:6px;color:var(--color-muted)}
.link-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:500;text-decoration:none;white-space:nowrap}
.link-more:hover{text-decoration:underline}
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:64px;align-items:start}
.about__intro p{margin-top:14px;font-size:var(--fs-lg)}
.about__intro .link-more{margin-top:8px}
.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;margin:0;padding:0}
.points li{display:flex;flex-direction:column;gap:8px;padding-top:20px;border-top:3px solid var(--color-primary)}
.site .points h3{font-size:1.25rem}
.points p{font-size:.9375rem}
.cta{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:center;padding:48px;border:1px solid var(--purple-200);border-radius:var(--radius-xl);background:var(--purple-50)}
.cta p{margin-top:12px}
.cta__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.steps{display:flex;flex-direction:column;gap:10px;list-style:none;counter-reset:step;margin:0;padding:0}
.steps li{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--radius);background:#fff;font-weight:500;color:var(--color-heading);counter-increment:step}
.steps li::before{content:counter(step);display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--color-primary);color:#fff;font:400 1rem/1 var(--font-heading)}

/* ===== 10. AD CARD ===== */
.ad-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ad-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.featured-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.ad-grid--peek .ad-card:nth-child(n+5){display:none}
.ad-card{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s,border-color .2s}
.ad-card:hover,.ad-card.is-hover{box-shadow:var(--shadow);border-color:var(--gray-300);transform:translateY(-2px)}
.ad-card:has(.ad-card__title a:focus-visible),.ad-card.is-focus{outline:3px solid var(--color-focus);outline-offset:2px}
.ad-card__title a:focus-visible{outline:none}
.ad-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--purple-50)}
.ad-card__media img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.ad-card__count{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;background:rgb(30 30 30/.75);color:#fff;font-size:.75rem;font-weight:500;line-height:1}
.ad-card__flag{position:absolute;left:10px;top:10px}
.ad-card__body{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0;padding:14px 16px 16px}
.site .ad-card__title{font-size:1.125rem;line-height:1.25}
.ad-card__title a{color:var(--color-heading);text-decoration:none}
.ad-card__title a::after{content:"";position:absolute;inset:0;z-index:1}
.ad-card__loc{display:flex;align-items:center;gap:5px;min-width:0;font-size:.875rem;color:var(--color-muted)}
.ad-card__loc-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-card__meta{display:flex;flex-wrap:wrap;margin-top:2px;font-size:.8125rem;color:var(--gray-600)}
.ad-card__meta>span+span::before{content:"·";margin:0 6px;color:var(--gray-400)}
.ad-card__desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;font-size:.875rem}
.ad-card__date{display:flex;align-items:center;gap:5px;margin-top:auto;padding-top:10px;font-size:.75rem;color:var(--color-muted)}
.ad-card--wide{flex-direction:row}
.ad-card--wide .ad-card__media{flex:none;width:46%;aspect-ratio:auto;min-height:280px}
.ad-card--wide .ad-card__body{padding:24px}
.site .ad-card--wide .ad-card__title{font-size:1.375rem}
.price{display:flex;align-items:baseline;gap:4px;font-size:1.375rem;font-weight:600;line-height:1.2;color:var(--color-primary);white-space:nowrap}
.price__unit{font-size:.8125rem;font-weight:400;color:var(--color-muted)}
.price--text{font-size:1.0625rem;color:var(--color-heading)}
.price--none{font-size:.9375rem;font-weight:500;color:var(--color-muted)}
.ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--purple-50) repeating-linear-gradient(135deg,transparent 0 14px,rgb(165 67 153/.06) 14px 28px);color:var(--purple-800);font-size:.8125rem;font-weight:500}
.ph__mark{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:#fff;color:var(--color-primary);font:400 26px/1 var(--font-heading);box-shadow:var(--shadow-sm)}
.ph__mark sup{font-size:.5em;line-height:0}

/* ===== 11. LIST PAGE ===== */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;list-style:none;margin:0;padding:0;font-size:.8125rem;color:var(--color-muted)}
.breadcrumb li+li::before{content:"/";margin-right:6px;color:var(--gray-400)}
.breadcrumb a{color:var(--gray-600);text-decoration:none}
.breadcrumb a:hover{color:var(--color-primary);text-decoration:underline}
.breadcrumb [aria-current]{color:var(--color-heading)}
.page-head{display:flex;flex-direction:column;gap:10px;padding:28px 0 24px}
.page-head__row{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px}
.count{color:var(--color-muted)}
.list-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:32px;align-items:start;padding-bottom:72px}
.filters{position:sticky;top:calc(var(--header-h) + 24px);display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.filters__head{display:none}
.filters__body{display:flex;flex-direction:column;gap:22px;padding:20px}
.filters fieldset{display:flex;flex-direction:column;gap:10px;min-width:0;margin:0;padding:0;border:0}
.filters legend{margin-bottom:10px;padding:0;font-weight:600;font-size:.9375rem;color:var(--color-heading)}
.price-range{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.filters__foot{display:flex;gap:8px;padding:16px 20px;border-top:1px solid var(--color-border)}
.filters__foot .btn-primary{flex:1}
.sheet-backdrop{display:none}
.results-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:44px;margin-bottom:20px}
.results-bar__label{margin-right:4px;font-size:.875rem;color:var(--color-muted)}
.filter-toggle{display:none}
.list-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:32px}
.list-foot p{font-size:.875rem;color:var(--color-muted)}
.pagination{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0}
.page-link{display:flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 12px;border:1px solid var(--color-border);border-radius:var(--radius);background:#fff;color:var(--color-heading);font-weight:500;font-size:.9375rem;text-decoration:none}
.page-link:hover,.page-link.is-hover{border-color:var(--color-primary);color:var(--color-primary)}
.page-link[aria-current="page"]{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.page-link.is-disabled{background:var(--gray-50);color:var(--gray-400);pointer-events:none}
.pagination__status{display:none}
.empty-state{display:flex;flex-direction:column;align-items:center;gap:12px;padding:56px 32px;text-align:center;background:#fff;border:1px dashed var(--gray-300);border-radius:var(--radius-lg)}
.empty-state__icon{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--purple-50);color:var(--color-primary)}
.empty-state__icon .icon{width:28px;height:28px}
.site .empty-state h2{font-size:1.5rem}
.empty-state p{max-width:40ch}
.empty-state__fix{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:8px;font-size:.875rem;color:var(--color-muted)}
.empty-state__fix .chips{justify-content:center}
.empty-state__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}

/* ===== 12. AD PAGE ===== */
.ad-page{padding-bottom:72px}
.ad-top{display:flex;flex-direction:column;padding-top:20px}
.ad-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:16px 0 20px}
.ad-head__loc{display:flex;align-items:center;gap:6px;margin-top:8px}
.ad-head__date{display:flex;align-items:center;gap:6px;font-size:.875rem;color:var(--color-muted);white-space:nowrap}
.gallery-wrap{position:relative}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:230px 230px;gap:8px;border-radius:var(--radius-xl);overflow:hidden}
.gallery__item{position:relative;margin:0;overflow:hidden;background:var(--gray-200)}
.gallery__item:first-child{grid-row:1/3}
.gallery__item img{display:block;width:100%;height:100%;object-fit:cover}
.gallery__all{position:absolute;right:16px;bottom:16px}
.gallery__counter,.gallery__back{display:none}
.ad-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;align-items:start;margin-top:32px}
.ad-main{grid-column:1;grid-row:1;min-width:0}
.ad-aside{grid-column:2;grid-row:1;position:sticky;top:calc(var(--header-h) + 24px)}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.fact{display:flex;flex-direction:column;gap:2px;padding:16px 20px}
.fact+.fact{border-left:1px solid var(--color-border)}
.fact dt{font-size:.8125rem;color:var(--color-muted)}
.fact dd{margin:0;font-weight:500;color:var(--color-heading);line-height:1.4}
.ad-section{padding:32px 0;border-bottom:1px solid var(--color-border)}
.site .ad-section h2{margin-bottom:16px;font-size:1.5rem}
.ad-desc{max-width:68ch;white-space:pre-line}
.amenities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;list-style:none;margin:0;padding:0}
.amenities li{display:flex;align-items:center;gap:10px;color:var(--color-heading)}
.amenities .icon{color:var(--color-primary)}
.amenities-missing{margin-top:20px;font-size:.875rem;color:var(--color-muted)}
.location-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.location-row p{display:flex;align-items:center;gap:6px}
.map{display:grid;place-items:center;aspect-ratio:16/7;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--gray-100) repeating-linear-gradient(135deg,transparent 0 14px,rgb(72 72 72/.045) 14px 28px)}
.map__inner{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px;text-align:center}
.map__label{font:500 .75rem/1.4 ui-monospace,Menlo,monospace;color:var(--color-muted)}
.contact-card{display:flex;flex-direction:column;gap:20px;padding:24px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow)}
.contact-card .price{font-size:2.25rem}
.contact-card .price__unit{font-size:1rem}
.costs{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;margin:0;font-size:.9375rem}
.costs dt{color:var(--color-muted)}
.costs dd{margin:0;text-align:right;font-weight:500;color:var(--color-heading)}
.notice{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--radius);background:var(--purple-50);color:var(--purple-800);font-size:.875rem;font-weight:500}
.contact{display:flex;flex-direction:column;gap:8px;padding-top:20px;border-top:1px solid var(--color-border)}
.site .contact h2{margin-bottom:4px;font-size:1.125rem}
.contact .btn{justify-content:flex-start}
.contact__note{font-size:.8125rem;color:var(--color-muted)}
.ad-tools{display:flex;gap:20px;font-size:.875rem}
.sticky-contact{display:none}
.ad-contact-m{display:none}
.contact-lines{display:flex;flex-direction:column;gap:4px;margin-bottom:8px;font-size:1.0625rem;font-weight:500}
.related{padding-top:48px}
.ad-scroller{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}

/* ===== 13. FOOTER ===== */
.site-footer{padding:56px 0 0;background:var(--gray-800);color:#e9e9e9;font-size:.9375rem}
.site .site-footer h2{margin-bottom:14px;font-size:1.125rem;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px}
.site-footer ul{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:#fff;text-decoration:underline}
.site-footer ul a{display:inline-flex;align-items:center;min-height:36px}
.site-footer address{font-style:normal;margin-bottom:8px}
.footer-logo{display:inline-flex;margin-bottom:16px;padding:10px 12px;border-radius:10px;background:#fff}
.footer-logo img{display:block;height:30px}
.footer-partner{margin-top:16px;padding-top:16px;border-top:1px solid rgb(255 255 255/.15);font-size:.8125rem;color:#cfcfcf}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;margin-top:48px;padding:20px 0;border-top:1px solid rgb(255 255 255/.15);font-size:.8125rem;color:#cfcfcf}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:20px}

/* ===== 14. MOBILE (v mockupu @container, v produkciji @media (max-width: 767.98px)) ===== */
@media (max-width: 767.98px){
.site{--fs-display:2.125rem;--fs-h1:1.625rem;--fs-h2:1.5rem;--fs-h3:1.25rem;--gutter:1rem;--header-h:60px}
.topbar,.main-nav,.header-actions .login,.header-actions .btn-add,.header-actions .account-link,.header-actions .account-btn{display:none}
.site-header .container{gap:8px;padding:0 10px 0 12px}
.logo .logo-full{display:none}
.logo .logo-mark{display:block;height:38px}
.has-hero .logo .logo-full{display:block;height:32px}
.has-hero .logo .logo-mark{display:none}
.header-search{max-width:none;margin:0}
.menu-toggle{display:inline-flex}
.mobile-menu.is-open{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;background:#fff;overflow:auto}
.mobile-menu__head{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 10px 0 12px;border-bottom:1px solid var(--color-border)}
.mobile-menu nav{display:flex;flex-direction:column;padding:8px 0}
.mobile-menu nav a{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 20px;border-bottom:1px solid var(--gray-100);font-size:1.0625rem;font-weight:500;color:var(--color-heading);text-decoration:none}
.mobile-menu nav a[aria-current="page"]{color:var(--purple-800)}
.mobile-menu__landlord{display:flex;flex-direction:column;gap:10px;margin-top:auto;padding:20px;background:var(--gray-50);border-top:1px solid var(--color-border)}
.mobile-menu__landlord p{font-size:.8125rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--color-muted)}
.search-dialog.is-open{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;background:#fff}
.search-dialog__bar{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--color-border)}
.search-dialog__bar .input-icon{flex:1}
.search-dialog__bar .input{height:44px;border-radius:var(--radius-pill)}
.search-dialog__body{display:flex;flex-direction:column;gap:16px;padding:12px 8px;overflow:auto}
.search-dialog .suggest{position:static;padding:0;border:0;box-shadow:none}
.hero{padding:28px 0 24px;text-align:left}
.site .hero h1{margin:0}
.hero__lead{margin:10px 0 0;font-size:.9375rem}
.hero-search{margin:20px 0 0;padding:6px;border-radius:14px}
.hero-search .input{height:48px;padding-left:42px;font-size:1rem}
.hero-search .input-icon>.icon{left:12px;width:20px;height:20px}
.hero-search .btn{min-height:48px;padding:0 16px}
.hero__chips{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:16px calc(-1 * var(--gutter)) 0;padding:0 var(--gutter);scrollbar-width:none}
.hero__chips-label{display:none}
.hero-alt{padding:28px 0}
.hero-alt .container{grid-template-columns:minmax(0,1fr)}
.collage{display:none}
.hero-form{grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;padding:14px}
.hero-form .field--type{grid-column:1/-1}
.hero-form__foot{flex-direction:column;align-items:stretch;gap:8px}
.hero-alt .chips{flex-wrap:nowrap;overflow-x:auto;margin:16px -16px 0;padding:0 16px;scrollbar-width:none}
.section{padding:36px 0}
.section-head{margin-bottom:16px}
.ad-grid,.ad-grid--3{grid-template-columns:minmax(0,1fr);gap:12px}
.ad-grid--home .ad-card:nth-child(n+7),.ad-grid--peek .ad-card:nth-child(n+3){display:none}
.ad-grid .ad-card{flex-direction:row;border-radius:14px}
.ad-grid .ad-card:hover{transform:none}
.ad-grid .ad-card__media{flex:none;width:124px;aspect-ratio:auto;min-height:140px}
.ad-grid .ad-card__body{gap:2px;padding:10px 12px 12px}
.ad-grid .price{font-size:1.125rem}
.site .ad-grid .ad-card__title{font-size:1rem}
.ad-grid .ad-card__loc{font-size:.8125rem}
.ad-grid .ad-card__meta{font-size:.75rem}
.ad-grid .ad-card__date{padding-top:6px}
.ad-grid .ad-card__count{right:6px;bottom:6px;padding:3px 7px}
.ad-grid .ad-card__flag{left:6px;top:6px}
.ad-grid .ph__mark{width:40px;height:40px;font-size:20px}
.ad-grid .ph__label{display:none}
.featured-grid,.ad-scroller{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:80%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter) 4px;scrollbar-width:none}
.featured-grid>*,.ad-scroller>*{scroll-snap-align:start}
.ad-card--wide{flex-direction:column}
.ad-card--wide .ad-card__media{width:auto;min-height:0;aspect-ratio:4/3}
.ad-card--wide .ad-card__body{padding:14px 16px 16px}
.site .ad-card--wide .ad-card__title{font-size:1.125rem}
.about,.cta{grid-template-columns:minmax(0,1fr);gap:24px}
.about__intro p{font-size:1rem}
.points{grid-template-columns:minmax(0,1fr);gap:20px}
.cta{padding:24px 20px}
.cta__actions .btn{flex:1}
.page-head{gap:2px;padding:16px 0 4px}
.page-head .breadcrumb{display:none}
.list-layout{grid-template-columns:minmax(0,1fr);gap:0;padding-bottom:40px}
.filters{display:none}
.filters.is-open{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:70;display:flex;max-height:90%;border:0;border-radius:20px 20px 0 0;box-shadow:var(--shadow-lg)}
.filters.is-open .filters__body{overflow:auto}
.filters__head{position:relative;display:flex;align-items:center;justify-content:space-between;padding:14px 8px 6px 20px;border-bottom:1px solid var(--color-border)}
.filters__head::before{content:"";position:absolute;top:6px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--gray-300)}
.site .filters__head h2{font-size:1.25rem}
.filters__foot .btn-ghost{flex:none}
.sheet-backdrop.is-open{position:fixed;inset:0;z-index:65;display:block;background:rgb(30 30 30/.5)}
.results-bar{position:sticky;top:var(--header-h);z-index:10;flex-wrap:nowrap;overflow-x:auto;margin:0 calc(-1 * var(--gutter)) 8px;padding:10px var(--gutter);background:var(--color-bg);scrollbar-width:none}
.results-bar__label,.results-bar .link-clear{display:none}
.filter-toggle{display:inline-flex;flex:none}
.list-foot{flex-direction:column-reverse;align-items:stretch;gap:12px}
.list-foot p{text-align:center}
.pagination{width:100%}
.pagination .page-item--num{display:none}
.pagination__status{display:block;flex:1;text-align:center;font-size:.875rem;color:var(--color-heading)}
.empty-state{padding:32px 20px}
.ad-page{padding-bottom:96px}
.ad-top{padding-top:0}
.ad-top .breadcrumb{display:none}
.gallery-wrap{order:-1;margin:0 calc(-1 * var(--gutter))}
.gallery{display:flex;height:292px;gap:0;border-radius:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gallery__item{flex:0 0 100%;scroll-snap-align:start}
.gallery__all{display:none}
.gallery__counter{position:absolute;right:12px;bottom:12px;display:block;padding:4px 10px;border-radius:999px;background:rgb(30 30 30/.75);color:#fff;font-size:.8125rem;font-weight:500}
.gallery__back{position:absolute;left:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--color-heading);box-shadow:0 1px 4px rgb(0 0 0/.2)}
.ad-head{flex-direction:column;align-items:flex-start;gap:4px;padding:16px 0 4px}
.ad-head__loc{margin-top:4px;font-size:.9375rem}
.ad-head__date{font-size:.8125rem}
.ad-layout{grid-template-columns:minmax(0,1fr);gap:0;margin-top:0}
.ad-aside{grid-column:1;grid-row:1;position:static}
.ad-main{grid-row:2}
.contact-card{gap:14px;padding:12px 0 20px;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:transparent;box-shadow:none}
.contact-card .price{font-size:1.75rem}
.contact-card .contact,.contact-card .ad-tools{display:none}
.ad-contact-m{display:block}
.facts{grid-template-columns:1fr 1fr;margin-top:16px}
.fact{padding:12px 14px}
.fact+.fact{border-left:0}
.fact:nth-child(even){border-left:1px solid var(--color-border)}
.fact:nth-child(n+3){border-top:1px solid var(--color-border)}
.ad-section{padding:24px 0}
.site .ad-section h2{font-size:1.25rem}
.amenities{grid-template-columns:1fr 1fr}
.map{aspect-ratio:4/3}
.sticky-contact{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;gap:8px;padding:10px 12px 16px;background:#fff;border-top:1px solid var(--color-border);box-shadow:0 -4px 16px rgb(0 0 0/.06)}
.sticky-contact .price{flex-direction:column;align-items:flex-start;gap:0;margin-right:auto;font-size:1.125rem;line-height:1.15}
.sticky-contact .btn{min-height:48px;padding:0 16px}
.related{padding-top:32px}
.footer-grid{grid-template-columns:1fr;gap:28px}
.site-footer{padding-top:40px}
.footer-bottom{flex-direction:column;margin-top:32px}
}

/* ======================================================================
   UPORABNIŠKI DEL (najemodajalci) — razdelki 15–22. Razdelki 1–14 so enaki kot v javnem delu.
   ====================================================================== */

/* ===== 15. STRAN, ZAVIHKI, POMOŽNO ===== */
.account-page{padding:28px 0 72px}
.account-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:16px}
.account-head__hello{margin-bottom:4px;color:var(--color-muted)}
.account-tabs{display:flex;gap:4px;margin-bottom:24px;border-bottom:1px solid var(--color-border);overflow-x:auto;scrollbar-width:none}
.account-tabs a{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 14px;margin-bottom:-1px;border-bottom:3px solid transparent;color:var(--gray-600);font-weight:500;text-decoration:none;white-space:nowrap}
.account-tabs a:hover{color:var(--color-heading);border-color:var(--gray-300)}
.account-tabs a[aria-current="page"]{border-color:var(--color-primary);color:var(--purple-800)}
.tab-count{display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 6px;border-radius:999px;background:var(--gray-100);color:var(--gray-700);font-size:.75rem;font-weight:600}
[aria-current="page"] .tab-count{background:var(--purple-100);color:var(--purple-800)}
.site-footer--slim{padding:0}
.site-footer--slim .footer-bottom{margin-top:0;border-top:0}
.link-btn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:none;font:500 .9375rem/1.2 var(--font-body);color:var(--color-primary);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.link-btn:hover{color:var(--color-primary-hover)}
.btn-danger{background:var(--purple-800);color:#fff}
.btn-danger:hover,.btn-danger.is-hover{background:var(--purple-900);color:#fff}
.btn-social{background:#fff;border-color:var(--gray-400);color:var(--color-heading)}
.btn-social:hover,.btn-social.is-hover{background:var(--gray-50);border-color:var(--gray-600);color:var(--color-heading)}
.btn-social svg{width:20px;height:20px;flex:none}
.divider{display:flex;align-items:center;gap:14px;font-size:.875rem;color:var(--color-muted)}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--color-border)}
.label-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.label-row a{font-size:.875rem;font-weight:500}
.req{margin-left:2px;color:var(--purple-800)}
.opt-tag{margin-left:6px;padding:1px 7px;border-radius:4px;background:var(--gray-100);font-size:.75rem;font-weight:500;color:var(--gray-600);vertical-align:1px}
.textarea{display:block;width:100%;min-height:96px;padding:12px 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius);background:#fff;font:400 1rem/1.5 var(--font-body);color:var(--color-heading);resize:vertical}
.textarea:focus-visible,.textarea.is-focus{outline:2px solid var(--color-focus);outline-offset:0;border-color:var(--color-focus)}
.select.is-invalid,.textarea.is-invalid{border:2px solid var(--purple-800)}
.select:disabled,.select.is-disabled,.textarea:disabled{background-color:var(--gray-100);border-color:var(--gray-200);color:var(--gray-500)}
.select.is-placeholder{color:var(--gray-500)}
.combo__btn{display:flex;align-items:center;text-align:left;cursor:pointer}
.input-action{position:relative;display:block}
.input-action .input{padding-right:52px}
.input-action__btn{position:absolute;right:2px;top:2px;bottom:2px;display:grid;place-items:center;width:44px;border:0;border-radius:var(--radius);background:transparent;color:var(--gray-600);cursor:pointer}
.check.is-disabled{color:var(--gray-500);cursor:not-allowed}
.check input:disabled{background:var(--gray-100);border-color:var(--gray-300)}
.check input.is-focus,.check input:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.segmented{display:inline-grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;padding:4px;border-radius:12px;background:var(--gray-100)}
.segmented--block{display:grid}
.segmented__opt{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 14px;border:0;border-radius:9px;background:transparent;color:var(--gray-700);font:500 .9375rem/1.2 var(--font-body);text-decoration:none;cursor:pointer;white-space:nowrap}
.segmented__opt:hover{background:rgb(255 255 255/.6);color:var(--color-heading)}
.segmented__opt.is-selected,.segmented__opt[aria-selected="true"]{background:#fff;color:var(--purple-800);box-shadow:0 1px 3px rgb(0 0 0/.12)}

.header-actions [aria-current="page"]{background:var(--purple-50);color:var(--purple-800)}
.page-alert{margin-bottom:20px}
.auth-form{display:flex;flex-direction:column;gap:16px}
.auth-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;font-size:.875rem}
.fold{padding:0 14px;border:1px solid var(--color-border);border-radius:var(--radius)}
.fold[open] .fold__summary{border-bottom:1px solid var(--color-border);margin-bottom:12px}
.fold__text{display:flex;flex-direction:column;min-width:0}
.fold__text b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-zone__drag{display:flex;flex-direction:column;gap:4px}
.preview-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:28px;align-items:start}

/* ===== 16. SPOROČILA ===== */
.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid transparent;border-radius:var(--radius);font-size:.9375rem;line-height:1.5}
.alert>.icon{margin-top:2px}
.alert__body{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.alert__title{font-weight:600}
.alert__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.alert__close{flex:none;width:44px;min-height:44px;margin:-10px -12px -10px 0;padding:0;color:inherit}
.alert__close:hover{background:rgb(0 0 0/.05);color:inherit}
.alert--success{background:var(--purple-50);border-color:var(--purple-200);color:var(--purple-900)}
.alert--success>.icon,.alert--info>.icon{color:var(--color-primary)}
.alert--info{background:#fff;border-color:var(--gray-300);color:var(--gray-800)}
.alert--warning{background:var(--gray-100);border-color:var(--gray-400);color:var(--gray-900)}
.alert--error{background:#fff;border:2px solid var(--purple-800);color:var(--gray-800)}
.alert--error>.icon,.alert--error .alert__title{color:var(--purple-800)}

/* ===== 17. ZNAČKE STANJ ===== */
.status-badge{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 11px 2px 8px;border:1.5px solid transparent;border-radius:var(--radius-pill);font:600 .8125rem/1.2 var(--font-body);white-space:nowrap}
.status-badge .icon{width:16px;height:16px;stroke-width:2.2}
.status-badge--draft{background:#fff;border-color:var(--gray-500);border-style:dashed;color:var(--gray-700)}
.status-badge--pending{background:var(--purple-50);border-color:var(--purple-300);color:var(--purple-800)}
.status-badge--published{background:var(--color-primary);color:#fff}
.status-badge--hidden{background:var(--gray-100);border-color:var(--gray-300);color:var(--gray-700)}
.status-badge--expired{background:#fff;border-color:var(--gray-700);color:var(--gray-800)}
.status-badge--closed{background:var(--gray-700);color:#fff}
.status-badge--rejected{background:#fff;border:2px solid var(--purple-800);color:var(--purple-800)}

/* ===== 18. MOJI OGLASI ===== */
.my-ads{display:flex;flex-direction:column;gap:12px}
.site .my-ads__group{display:flex;align-items:center;gap:10px;margin-top:20px;font:600 .8125rem/1.4 var(--font-body);letter-spacing:.05em;text-transform:uppercase;color:var(--color-muted)}
.site .my-ads__group:first-child{margin-top:0}
.my-ad{position:relative;display:grid;grid-template-columns:152px minmax(0,1fr) auto;grid-template-areas:"media body actions" "media note note";gap:12px 24px;padding:16px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.my-ad.is-new{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--purple-100)}
.my-ad__media{grid-area:media;position:relative;align-self:start;width:152px;aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;background:var(--purple-50)}
.my-ad__media img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.my-ad__media .ph__mark{width:40px;height:40px;font-size:20px}
.my-ad.is-muted .my-ad__media img{filter:grayscale(1);opacity:.7}
.my-ad__body{grid-area:body;display:flex;flex-direction:column;gap:6px;min-width:0}
.my-ad__top{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px}
.my-ad__date{font-size:.8125rem;color:var(--color-muted)}
.site .my-ad__title{font-size:1.25rem}
.my-ad__public{font-size:.875rem;color:var(--gray-600)}
.my-ad__public b{font-weight:500;color:var(--color-heading)}
.my-ad__public a{white-space:nowrap}
.my-ad__actions{grid-area:actions;display:flex;align-items:flex-start;gap:8px}
.my-ad__note{grid-area:note;display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:var(--radius);background:var(--gray-50);font-size:.875rem;line-height:1.5;color:var(--gray-700)}
.my-ad__note>.icon{margin-top:1px;color:var(--gray-600)}
.my-ad__note b{font-weight:600;color:var(--color-heading)}
.my-ad__note--editor{background:var(--purple-50);color:var(--purple-900)}
.my-ad__note--editor>.icon,.my-ad__note--editor b{color:var(--purple-800)}
.my-ad__note a{font-weight:500}
.more{position:relative}
.menu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;display:none;min-width:240px;padding:6px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.menu.is-open{display:block}
.menu__head{display:none}
.menu__item{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:var(--radius);background:none;font:500 .9375rem/1.2 var(--font-body);color:var(--color-heading);text-align:left;text-decoration:none;cursor:pointer}
.menu__item:hover,.menu__item.is-hover{background:var(--purple-50);color:var(--color-heading)}
.menu__item .icon{color:var(--gray-600)}
.menu__item--danger,.menu__item--danger .icon,.menu__item--danger:hover{color:var(--purple-800)}
.menu__sep{height:1px;margin:6px 4px;background:var(--gray-200)}

/* ===== 19. POGOVORNO OKNO / SPODNJI PREDAL ===== */
.dialog-backdrop{display:none}
.dialog-backdrop.is-open{position:fixed;inset:0;z-index:85;display:grid;place-items:center;padding:24px;background:rgb(30 30 30/.5)}
.dialog{position:relative;display:flex;flex-direction:column;gap:16px;width:100%;max-width:520px;padding:24px;background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}
.dialog--wide{max-width:760px}
.dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.site .dialog h2{font-size:1.5rem}
.dialog__close{flex:none;margin:-8px -8px 0 0}
.dialog__foot{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:4px}
.submit-check__list{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;border:1px solid var(--color-border);border-radius:var(--radius)}
.submit-check__list li+li{border-top:1px solid var(--color-border)}
.submit-check__list a{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 14px;color:var(--color-heading);font-weight:500;text-decoration:none}
.submit-check__list a:hover{background:var(--purple-50);color:var(--color-heading)}
.submit-check__list .icon{color:var(--purple-800)}
.submit-check--soft .submit-check__list .icon{color:var(--gray-600)}
.submit-check__where{margin-left:auto;font-size:.8125rem;font-weight:400;color:var(--color-muted);white-space:nowrap}

/* ===== 20. PRIJAVA IN REGISTRACIJA ===== */
.auth{padding:56px 0 80px}
.auth__grid{display:grid;grid-template-columns:minmax(0,480px) minmax(0,360px);justify-content:center;gap:72px;align-items:start}
.auth__grid--single{grid-template-columns:minmax(0,480px)}
.auth-card{display:flex;flex-direction:column;gap:20px;padding:36px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}
.auth-card__head{display:flex;flex-direction:column;gap:8px}
.site .auth-card h1{font-size:2rem}
.auth-card__lead{color:var(--gray-600)}
.auth-icon{display:grid;place-items:center;width:56px;height:56px;margin-bottom:8px;border-radius:50%;background:var(--purple-50);color:var(--color-primary)}
.auth-icon .icon{width:26px;height:26px}
.auth-switch{padding-top:20px;border-top:1px solid var(--color-border);text-align:center}
.auth-legal{font-size:.8125rem;color:var(--color-muted)}
.auth-aside{display:flex;flex-direction:column;gap:20px;padding-top:24px}
.site .auth-aside h2{font-size:1.5rem}
.auth-aside__foot{font-size:.875rem;color:var(--color-muted)}
.social{display:flex;flex-direction:column;gap:10px}
.code-input{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.code-input .input{height:60px;padding:0;text-align:center;font-size:1.5rem;font-weight:600}
.turnstile{display:flex;align-items:center;gap:12px;width:100%;height:65px;padding:0 14px;border:1px solid #d6d6d6;border-radius:6px;background:#fafafa;font:400 .875rem/1.2 system-ui,sans-serif;color:#2e2e2e}
.turnstile__box{display:grid;place-items:center;flex:none;width:26px;height:26px;border:2px solid #9a9a9a;border-radius:4px;background:#fff}
.turnstile__box--ok{border:0;border-radius:50%;background:var(--gray-700);color:#fff}
.turnstile__brand{margin-left:auto;font:700 .625rem/1.3 system-ui,sans-serif;letter-spacing:.08em;text-align:right;color:#5a5a5a}
.turnstile__brand span{display:block;font-weight:400;letter-spacing:0;text-decoration:underline}

/* ===== 21. OBRAZEC OGLASA ===== */
.ad-form-page{padding-bottom:72px}
.form-intro{max-width:64ch;color:var(--gray-600)}
.form-banner{margin-bottom:24px}
.ad-form-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;align-items:start}
.ad-form{display:flex;flex-direction:column;gap:20px;min-width:0}
.form-section{display:flex;flex-direction:column;gap:20px;min-width:0;padding:28px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);scroll-margin-top:calc(var(--header-h) + 16px)}
.form-section__head{display:flex;align-items:center;gap:14px}
.site .form-section h2{font-size:1.375rem}
.form-section__lead{margin-top:2px;font-size:.875rem;color:var(--color-muted)}
.step-num{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--gray-100);color:var(--gray-700);font:400 1.0625rem/1 var(--font-heading)}
.step-num.is-done{background:var(--color-primary);color:#fff}
.step-num.is-missing{background:#fff;border:2px solid var(--purple-800);color:var(--purple-800)}
.form-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 16px}
.field--full{grid-column:1/-1}
.field--half,.field--pair{grid-column:span 3}
.field--third{grid-column:span 2}
.switch-row{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--gray-50)}
.switch-row .help{max-width:52ch}
.check-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
.check-group{display:flex;flex-direction:column;min-width:0;margin:0;padding:0;border:0}
.check-group legend,.check-group__title{margin-bottom:4px;padding:0;font-size:.8125rem;font-weight:600;color:var(--gray-600)}
.check-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 16px}
.fold{border-top:1px solid var(--color-border)}
.fold__summary{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 0;cursor:pointer;list-style:none}
.fold__summary::-webkit-details-marker{display:none}
.fold__summary b{font-weight:500;color:var(--color-heading)}
.fold__summary span{font-size:.875rem;color:var(--color-muted)}
.fold__summary .link-btn{margin-left:auto}
.combo{position:relative}
.combo__panel{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;padding:8px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.combo__panel--static{position:static;box-shadow:var(--shadow)}
.combo__panel .input{height:44px}
.combo__list{display:flex;flex-direction:column;max-height:248px;margin:8px 0 0;padding:0;list-style:none;overflow:auto}
.combo__option{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 12px;border-radius:var(--radius);color:var(--color-heading);cursor:pointer}
.combo__option:hover,.combo__option.is-active{background:var(--purple-50)}
.combo__option[aria-selected="true"]{font-weight:600;color:var(--purple-800)}
.combo__option mark{background:none;color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.combo__count{font-size:.8125rem;color:var(--color-muted)}
.combo__empty{padding:12px;font-size:.875rem;color:var(--color-muted)}
.map-picker{position:relative;aspect-ratio:16/7;border:1px solid var(--color-border-strong);border-radius:var(--radius);overflow:hidden;background:var(--gray-100) repeating-linear-gradient(135deg,transparent 0 14px,rgb(72 72 72/.045) 14px 28px)}
.map-picker__pin{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-100%);color:var(--color-primary);filter:drop-shadow(0 2px 3px rgb(0 0 0/.3))}
.map-picker__hint{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px 12px;border-radius:999px;background:#fff;color:var(--color-heading);font-size:.8125rem;font-weight:500;box-shadow:0 1px 4px rgb(0 0 0/.18)}
.map-picker__label{position:absolute;right:12px;top:10px;font:500 .75rem/1.4 ui-monospace,Menlo,monospace;color:var(--color-muted)}
.upload{display:flex;flex-direction:column;gap:12px}
.upload-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px 20px;border:2px dashed var(--gray-400);border-radius:var(--radius-lg);background:var(--gray-50);text-align:center}
.upload-zone__icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#fff;color:var(--color-primary);box-shadow:var(--shadow-sm)}
.upload-zone__title{font-weight:500;color:var(--color-heading)}
.upload-zone__help{font-size:.8125rem;color:var(--color-muted)}
.upload-zone__touch{display:none}
.upload-zone--compact{flex-direction:row;justify-content:flex-start;gap:14px;padding:14px 16px;text-align:left}
.upload-zone--compact .upload-zone__icon{width:44px;height:44px}
.upload-zone--compact .btn{margin-left:auto}
.upload-zone.is-dragover{border-style:solid;border-color:var(--color-primary);background:var(--purple-50)}
.upload-zone.is-invalid{border-color:var(--purple-800);background:#fff}
.upload-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.upload-tile{position:relative;aspect-ratio:4/3;border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden;background:var(--gray-100)}
.upload-tile img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.upload-tile__tag{position:absolute;left:8px;top:8px;display:flex;gap:4px}
.upload-tile__tools{position:absolute;right:6px;top:6px;display:flex;gap:4px}
.tile-btn{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:#fff;color:var(--color-heading);box-shadow:0 1px 3px rgb(0 0 0/.25);cursor:pointer}
.tile-btn:hover{background:var(--purple-50);color:var(--purple-800)}
.tile-btn--grip{cursor:grab}
.upload-tile__progress{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:12px;background:rgb(30 30 30/.62);color:#fff;font-size:.8125rem;font-weight:500}
.upload-tile__progress .progress{background:rgb(255 255 255/.3)}
.upload-tile__progress .progress__bar{background:#fff}
.upload-tile--error{display:flex;flex-direction:column;justify-content:center;gap:4px;padding:12px;border:2px solid var(--purple-800);background:#fff;font-size:.8125rem;line-height:1.4}
.upload-tile--error b{display:flex;align-items:center;gap:6px;color:var(--purple-800);font-weight:600}
.upload-tile--error .link-btn{min-height:32px;font-size:.8125rem}
.upload-tile.is-dragging{transform:rotate(-2deg);box-shadow:var(--shadow-lg);outline:3px solid var(--color-primary)}
.upload-tile--slot{border:2px dashed var(--color-primary);background:var(--purple-50)}
.progress{height:8px;border-radius:999px;background:var(--gray-100);overflow:hidden}
.progress__bar{height:100%;border-radius:inherit;background:var(--color-primary)}
.editor{border:1px solid var(--color-border-strong);border-radius:var(--radius);background:#fff;overflow:hidden}
.editor:focus-within,.editor.is-focus{outline:2px solid var(--color-focus);border-color:var(--color-focus)}
.editor.is-invalid{border:2px solid var(--purple-800)}
.editor__toolbar{display:flex;align-items:center;gap:4px;padding:6px;border-bottom:1px solid var(--color-border);background:var(--gray-50)}
.editor__btn{display:grid;place-items:center;min-width:40px;height:40px;padding:0 10px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--color-heading);font:600 1.0625rem/1 Georgia,serif;cursor:pointer}
.editor__btn:hover,.editor__btn.is-hover{background:var(--gray-200)}
.editor__btn.is-active,.editor__btn[aria-pressed="true"]{background:var(--purple-100);color:var(--purple-800)}
.editor__btn.is-focus{outline:3px solid var(--color-focus);outline-offset:-1px}
.editor__btn:disabled{color:var(--gray-400);background:none}
.editor__btn--i{font-style:italic;font-weight:400}
.editor__sep{width:1px;height:24px;margin:0 4px;background:var(--gray-300)}
.editor__count{margin-left:auto;padding-right:8px;font-size:.75rem;color:var(--color-muted)}
.editor__content{display:flex;flex-direction:column;gap:10px;min-height:180px;padding:14px 16px;font-size:1rem;line-height:1.6;color:var(--color-heading)}
.editor__content ul{margin:0;padding-left:22px}
.editor__placeholder{color:var(--gray-500)}
.editor-hints{display:flex;flex-wrap:wrap;gap:6px 8px;font-size:.8125rem;color:var(--color-muted)}
.editor-hints span{padding:3px 10px;border-radius:999px;background:var(--gray-100);color:var(--gray-700)}
.form-aside{position:sticky;top:calc(var(--header-h) + 24px);display:flex;flex-direction:column;gap:16px}
.form-progress{display:flex;flex-direction:column;gap:14px;padding:20px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.form-progress__title{font-weight:600;color:var(--color-heading)}
.form-progress__sub{margin-top:-8px;font-size:.8125rem;color:var(--color-muted)}
.form-toc{display:flex;flex-direction:column;margin:0 -10px;padding:0;list-style:none}
.form-toc a{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border-radius:var(--radius);color:var(--color-heading);font-size:.9375rem;font-weight:500;text-decoration:none}
.form-toc a:hover{background:var(--gray-50);color:var(--color-heading)}
.form-toc a[aria-current="true"]{background:var(--purple-50);color:var(--purple-800)}
.form-toc .step-num{width:26px;height:26px;font-size:.875rem}
.toc-state{margin-left:auto;font-size:.8125rem;font-weight:500;color:var(--color-muted);white-space:nowrap}
.toc-state--missing{color:var(--purple-800)}
.form-actions{display:flex;flex-direction:column;gap:8px}
.form-actions__note{display:flex;gap:8px;font-size:.8125rem;line-height:1.45;color:var(--gray-600)}
.form-actions__note .icon{margin-top:1px}
.form-bar{display:none}
.preview-card{max-width:340px}
.preview-meta{display:flex;flex-direction:column;gap:8px;font-size:.875rem;color:var(--gray-600)}

/* ===== 22. MOJ RAČUN ===== */
.settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.settings-card{display:flex;flex-direction:column;gap:20px;padding:28px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.settings-card--full{grid-column:1/-1}
.site .settings-card h2{font-size:1.375rem}
.settings-card__foot{display:flex;justify-content:flex-end;gap:8px}
.settings-rows{display:flex;flex-direction:column}
.settings-row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;padding:12px 0;border-top:1px solid var(--color-border)}
.settings-row__main{display:flex;align-items:center;gap:14px;min-width:0}
.settings-row__title{font-weight:500;color:var(--color-heading)}
.settings-row__meta{font-size:.875rem;color:var(--color-muted)}
.provider-icon{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid var(--color-border);border-radius:12px;background:#fff;color:var(--color-primary)}
.provider-icon svg{width:22px;height:22px}

/* ===== 23. MOBILNO (@container v mockupu, @media (max-width: 767.98px) v produkciji) ===== */
@media (max-width: 767.98px){
.account-page{padding:16px 0 48px}
.account-head{flex-direction:column;align-items:stretch;gap:14px}
.account-head .btn{width:100%}
.account-tabs{margin:0 calc(-1 * var(--gutter)) 16px;padding:0 var(--gutter)}
.my-ad{grid-template-columns:88px minmax(0,1fr);grid-template-areas:"media body" "note note" "actions actions";gap:12px;padding:12px;border-radius:14px;position:static}
.my-ad__media{width:88px}
.site .my-ad__title{font-size:1.0625rem}
.my-ad__public a{display:none}
.my-ad__actions .btn{flex:1;padding:0 12px}
.my-ad__actions .more{flex:none}
.more{position:static}
.menu.is-open{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:90;min-width:0;padding:8px 8px 20px;border:0;border-radius:20px 20px 0 0}
.menu__head{position:relative;display:block;padding:20px 12px 8px;font-weight:600;color:var(--color-heading)}
.menu__head::before{content:"";position:absolute;top:6px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--gray-300)}
.menu__item{min-height:52px;font-size:1rem}
.dialog-backdrop.is-open{place-items:end stretch;padding:0}
.dialog{max-width:none;gap:14px;padding:22px 16px 20px;border-radius:20px 20px 0 0}
.dialog::before{content:"";position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--gray-300)}
.site .dialog h2{font-size:1.25rem}
.dialog__foot{flex-direction:column-reverse}
.dialog__foot .btn{width:100%;min-height:48px}
.submit-check__where{display:none}
.auth{padding:16px 0 40px}
.auth__grid,.auth__grid--single{grid-template-columns:minmax(0,1fr);gap:28px}
.auth-card{gap:18px;padding:22px 16px;border-radius:var(--radius-lg)}
.site .auth-card h1{font-size:1.625rem}
.auth-aside{padding-top:0}
.site .auth-aside h2{font-size:1.25rem}
.code-input{gap:6px}
.code-input .input{height:56px}
.segmented__opt{min-height:44px}
.ad-form-page{padding-bottom:120px}
.ad-form-layout{grid-template-columns:minmax(0,1fr);gap:0}
.form-aside{display:none}
.form-section{gap:18px;padding:20px 16px;border-radius:14px}
.site .form-section h2{font-size:1.25rem}
.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
.field--half{grid-column:1/-1}
.field--pair,.field--third{grid-column:span 1}
.check-groups{grid-template-columns:minmax(0,1fr);gap:12px}
.check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.map-picker{aspect-ratio:4/3}
.upload-zone__drag{display:none}
.upload-zone__touch{display:flex;flex-direction:column;gap:8px;width:100%}
.upload-zone--compact .upload-zone__touch{flex-direction:row}
.upload-zone--compact{flex-direction:column;align-items:stretch;text-align:center}
.upload-zone--compact .upload-zone__icon{display:none}
.upload-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tile-btn{width:44px;height:44px}
.upload-tile__tag{top:auto;bottom:8px}
.editor__btn{min-width:44px;height:44px}
.editor__count{display:none}
.form-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;gap:8px;padding:10px 12px 16px;background:#fff;border-top:1px solid var(--color-border);box-shadow:0 -4px 16px rgb(0 0 0/.06)}
.form-bar__status{display:flex;flex-direction:column;flex:1;min-width:0;padding:0;border:0;background:none;font:400 .8125rem/1.35 var(--font-body);color:var(--gray-600);text-align:left;cursor:pointer}
.form-bar__status b{font-size:.9375rem;font-weight:600;color:var(--purple-800)}
.form-bar__status b.is-ok{color:var(--color-heading)}
.form-bar .btn{min-height:48px}
.settings{grid-template-columns:minmax(0,1fr);gap:16px}
.settings-card{padding:20px 16px}
.settings-row{flex-wrap:wrap;gap:10px}
.settings-row .btn{width:100%}
.preview-grid{grid-template-columns:minmax(0,1fr);gap:16px}
.preview-card{max-width:none}
.dialog--wide{max-height:92%;overflow:auto}
}

/* ===== 24. SITE — what the handoff leaves to the implementation ===== */
/* page frame */
.section--flush{padding-top:0}
html{scroll-padding-top:96px}
body.site{min-height:100vh}
[hidden]{display:none!important}
html.is-locked{overflow:hidden}
.skip-link{position:absolute;left:12px;top:-80px;z-index:100;padding:10px 16px;border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);font-weight:500}
.skip-link:focus{top:12px}
.site mark{padding:0 2px;border-radius:3px;background:var(--purple-100);color:inherit}

/* header: the account menu (section 18's .more/.menu) and the logo sizes */
.header-actions .more .menu{top:calc(100% + 8px)}
.mobile-menu__head .logo img{height:32px}
.mobile-menu__landlord .btn{white-space:normal}

/* search suggestions: the sheet's quick chips and states */
.suggest__state{padding:12px;font-size:.875rem;color:var(--color-muted)}
.search-dialog__chips{padding:0 8px}
.search-dialog__chips .suggest__title{padding:4px 0 10px}
.search-dialog .suggest__hint{font-size:.875rem;line-height:1.5}

/* ad card: a photo that never loads leaves the placeholder visible */
.ad-card__media .ph{z-index:0}
.ad-card__media img{z-index:0}

/* ad page: galleries with fewer than five photos, the photo viewer */
.gallery__item>a{display:block;height:100%;cursor:zoom-in}
.gallery__item:nth-child(n+6){display:none}
.gallery--1{grid-template-columns:minmax(0,1fr);grid-template-rows:468px}
.gallery--2{grid-template-columns:2fr 1fr}
.gallery--2 .gallery__item:nth-child(2){grid-row:1/3}
.gallery--1 .gallery__item:first-child{grid-row:auto}
.gallery--3{grid-template-columns:2fr 1fr}
.gallery--4 .gallery__item:nth-child(4){grid-column:2/4}
.viewer{width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgb(20 20 20/.95);color:#fff}
.viewer[open]{display:flex;flex-direction:column}
.viewer::backdrop{background:rgb(20 20 20/.95)}
.viewer__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 20px}
.viewer__count{font-size:.9375rem;font-weight:500}
.viewer__stage{position:relative;display:grid;place-items:center;flex:1;min-height:0;padding:0 72px 24px}
.viewer__stage img{display:block;max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--radius)}
.viewer .btn-ghost{color:#fff}
.viewer .btn-ghost:hover{background:rgb(255 255 255/.14);color:#fff}
.viewer :focus-visible{outline-color:#fff}
.viewer__nav{position:absolute;top:50%;transform:translateY(-50%)}
.viewer__nav--prev{left:12px}
.viewer__nav--next{right:12px}

/* ad page: description is the landlord's rich text, not pre-formatted text */
.ad-desc{white-space:normal}
.ad-desc>*+*{margin-top:.75em}
.ad-desc ul,.ad-desc ol{margin:0;padding-left:1.4em}
.ad-desc p:empty{display:none}
.facts--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.facts--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.facts--1{grid-template-columns:minmax(0,1fr)}
.map.is-loaded{display:block;overflow:hidden}
.map iframe{display:block;width:100%;height:100%;border:0}
.toast{position:fixed;left:50%;bottom:24px;z-index:95;max-width:calc(100% - 32px);padding:12px 18px;border-radius:var(--radius);background:var(--gray-800);color:#fff;font-size:.9375rem;box-shadow:var(--shadow-lg);transform:translateX(-50%)}

/* content pages (01-subpage-defalut.tpl) and the error page */
.error-page{padding:48px var(--gutter) 72px}
.site .empty-state h1{font-size:1.75rem}
.page-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;align-items:start;padding-bottom:72px}
.page-body--single{grid-template-columns:minmax(0,1fr)}
.page-lead{max-width:60ch;font-size:var(--fs-lg);color:var(--gray-600)}
.prose{max-width:72ch;padding:32px 36px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:1.0625rem}
.prose>*+*{margin-top:1em}
.site .prose h2{margin-top:1.6em;font-size:1.75rem}
.site .prose h3{margin-top:1.4em;font-size:1.375rem}
.site .prose h4{margin-top:1.2em}
.site .prose :is(h2,h3,h4):first-child{margin-top:0}
.prose ul,.prose ol{padding-left:1.4em}
.prose li+li{margin-top:.35em}
.prose img{border-radius:var(--radius)}
.prose blockquote{margin-left:0;margin-right:0;padding:4px 0 4px 20px;border-left:3px solid var(--color-primary)}
.prose th,.prose td{padding:8px 12px;border:1px solid var(--color-border);text-align:left;vertical-align:top}
.prose hr{border:0;border-top:1px solid var(--color-border)}
.files{display:flex;flex-direction:column;gap:8px;list-style:none;margin:24px 0 0;padding:0}
.files a{display:flex;align-items:center;gap:10px;min-height:44px;font-weight:500}
.files small{font-weight:400;color:var(--color-muted)}
.side-card{position:sticky;top:calc(var(--header-h) + 24px);display:flex;flex-direction:column;gap:8px;padding:20px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.site .side-card h2{font-size:1.25rem}
.side-card ul{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.side-card a{display:flex;align-items:center;min-height:44px;padding:0 12px;margin:0 -12px;border-radius:var(--radius);color:var(--color-heading);font-weight:500;text-decoration:none}
.side-card a:hover{background:var(--gray-50)}
.side-card .active>a,.side-card a[aria-current="page"]{background:var(--purple-50);color:var(--purple-800)}

/* search page (/iskanje) */
.search-page{padding-bottom:72px}
.search-page .ad-grid{margin-bottom:8px}
.search-row{display:flex;gap:8px;max-width:720px;margin-bottom:24px}
.search-row .input-icon{flex:1;min-width:0}
.search-note{display:flex;align-items:flex-start;gap:10px;margin-bottom:20px}
.site .search-group{margin:40px 0 16px;font-size:1.5rem}
.page-results{display:flex;flex-direction:column;gap:12px;list-style:none;margin:0;padding:0}
.page-result{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 20px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:box-shadow .2s,border-color .2s}
.page-result:hover{box-shadow:var(--shadow);border-color:var(--gray-300)}
.site .page-result h3{font-size:1.25rem}
.page-result h3 a{color:var(--color-heading);text-decoration:none}
.page-result h3 a::after{content:"";position:absolute;inset:0}
.page-result p{font-size:.9375rem;color:var(--gray-600)}

@media (max-width: 767.98px){
.viewer__stage{padding:0 8px 16px}
.viewer__nav{top:auto;bottom:16px;transform:none}
.gallery__item:nth-child(n+6){display:block}
.gallery--1{grid-template-rows:none}
.toast{bottom:96px}
.page-body{grid-template-columns:minmax(0,1fr);gap:24px;padding-bottom:48px}
.prose{padding:20px 16px;font-size:1rem}
.site .prose h2{font-size:1.375rem}
.site .prose h3{font-size:1.1875rem}
.side-card{position:static}
.search-row .btn{padding:0 16px}
.search-page{padding-bottom:48px}
.site:has(.sticky-contact) .site-footer{padding-bottom:84px}
}

@media print{
.topbar,.site-header,.site-footer,.sticky-contact,.gallery__all,.gallery__back,.ad-tools,.related,.map,.skip-link,.filters,.results-bar{display:none!important}
.site{background:#fff}
.ad-layout{display:block}
.ad-aside{position:static}
.contact-card{box-shadow:none}
}

@media (prefers-reduced-motion: reduce){
*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
.ad-card:hover{transform:none}
}

/* ===== 25. LANDLORD AREA — what sections 15–23 leave to the implementation =====
   (the pages under /uporabnik on site/layout.tpl, handoff "m2 Uporabniski del") */
/* the shared partials print Bootstrap / boilerplate classes (partials/user-alerts.tpl,
   filepond-submit-guard.tpl, user-post-rules.tpl) — dressed as section 16's alerts */
.site .alert-warning,.site .alert-danger,.site .alert-basic.is-error{background:#fff;border:2px solid var(--purple-800);color:var(--gray-800)}
.site .alert-success,.site .alert-basic.is-success{background:var(--purple-50);border-color:var(--purple-200);color:var(--purple-900)}
.site .alert-info,.site .alert-basic.is-info{background:#fff;border-color:var(--gray-300);color:var(--gray-800)}
.site .alert-basic{display:block;padding:14px 16px;border:1px solid transparent;border-radius:var(--radius);font-size:.9375rem;line-height:1.5}
.site .alert-basic ul{margin:6px 0 0;padding-left:20px}
.site .alert-basic p+p{margin-top:6px}
.site .alert-basic .btn-one,.site .alert-basic .btn-two{display:inline-flex;align-items:center;min-height:40px;margin-top:10px;padding:8px 16px;border:1.5px solid var(--color-primary);border-radius:var(--radius);font:500 .9375rem/1.2 var(--font-body);cursor:pointer}
.site .alert-basic .btn-two{background:var(--color-primary);color:#fff}
.site .alert-basic .btn-one{background:#fff;color:var(--color-primary)}
/* "Moji oglasi": renew / show / hide / delete are POST forms around one button */
.my-ad__actions form{display:flex;margin:0}
.menu form{margin:0}
.my-ad__note p{min-width:0}
.my-ad__title{overflow-wrap:anywhere}
.site .empty-state h2{font-size:1.5rem}
/* login / register / reset (80-user-*.tpl) */
.auth-card>.link-btn{align-self:flex-start;min-height:32px}
.auth-row .cf-turnstile{flex-basis:100%}
.link-btn:disabled{color:var(--color-muted);text-decoration:none;cursor:default}
.auth-card .cf-turnstile{min-height:0}
.auth-form .check a{font-weight:500}
/* "Moj račun" (80-user-account.tpl) */
.settings-row--plain{padding:0;min-height:0;border-top:0}
.settings-card .fold form{padding-bottom:16px}
.settings-card .fold .alert{margin-bottom:12px}
.settings-card>.auth-form{gap:16px}
/* the ad form (20-postview-place-edit.tpl): ONE <form> is the two-column layout —
   sections | sticky aside (progress, contents, buttons), then the end block
   (rules message, Turnstile) under the sections; the phone bar is fixed */
.ad-form-layout{grid-template-areas:"main aside" "end aside"}
.ad-form{grid-area:main}
.form-aside{grid-area:aside}
.form-end{grid-area:end;display:flex;flex-direction:column;gap:16px;min-width:0}
.form-end__phone{display:none}
.form-bar__status{text-decoration:none}
.form-banner .alert__actions{margin-top:10px}
.form-banner ul{margin:4px 0 0;padding-left:20px}
.fold__body{padding:4px 0 16px}
.map-picker--live{background:var(--gray-100)}
/* FilePond in the handoff's dress: the drop zone (.upload-zone) and 4:3 tiles */
.upload .filepond--root{margin:0;font-family:var(--font-body);font-size:.875rem}
.upload .filepond--panel-root{background:var(--gray-50);border:2px dashed var(--gray-400);border-radius:var(--radius-lg)}
.upload .filepond--root:hover .filepond--panel-root{border-color:var(--color-primary)}
.upload .filepond--drop-label{min-height:8.5em;color:var(--color-heading)}
.upload .filepond--drop-label label{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px;cursor:pointer}
.upload .filepond--drop-label .upload-zone__title{font-size:1rem}
.upload .filepond--label-action{color:var(--color-primary);text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:3px}
.upload .filepond--item{width:calc(25% - .5em)}
.upload .filepond--item-panel{border-radius:var(--radius);background:var(--gray-700)}
.upload [data-filepond-item-state="processing-complete"] .filepond--item-panel{background:var(--color-primary)}
.upload .filepond--file-action-button{cursor:pointer}
.upload .filepond--list .filepond--item:first-child .filepond--file::after{content:"Naslovna";position:absolute;left:.5em;bottom:.5em;padding:3px 8px;border-radius:var(--radius-sm);background:var(--color-primary);color:#fff;font:500 .75rem/1.2 var(--font-body)}
/* a refused file: white tile, 2 px purple edge and the reason in full (two
   lines, no ellipsis); the file name is in the guard's sentence below */
.upload [data-filepond-item-state*="error"] .filepond--item-panel,.upload [data-filepond-item-state*="invalid"] .filepond--item-panel{background:#fff;box-shadow:inset 0 0 0 2px var(--purple-800)}
.upload [data-filepond-item-state*="error"] .filepond--file,.upload [data-filepond-item-state*="invalid"] .filepond--file{color:var(--purple-800)}
.upload [data-filepond-item-state*="error"] .filepond--file-info,.upload [data-filepond-item-state*="invalid"] .filepond--file-info{display:none}
.upload [data-filepond-item-state*="error"] .filepond--file-status,.upload [data-filepond-item-state*="invalid"] .filepond--file-status{flex:1 1 auto;min-width:0;margin-left:0;text-align:left}
.upload .filepond--file-status-main,.upload .filepond--file-status-sub{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.upload [data-filepond-item-state*="error"] .filepond--file-status-sub,.upload [data-filepond-item-state*="invalid"] .filepond--file-status-sub{opacity:1}
.upload .filepond-guard-msg{margin-top:8px}
/* the description's basic editor (rte-basic) as the handoff's .editor */
.ad-form .rte-basic{border:1px solid var(--color-border-strong);border-radius:var(--radius);background:#fff;overflow:hidden}
.ad-form .rte-basic.is-focused{outline:2px solid var(--color-focus);border-color:var(--color-focus)}
.ad-form .rte-basic-toolbar{gap:4px;margin:0;padding:6px;border:0;border-bottom:1px solid var(--color-border);background:var(--gray-50)}
.ad-form .rte-basic-btn{min-width:40px;height:40px;padding:0 10px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--color-heading);font:600 1.0625rem/1 Georgia,serif;opacity:1}
.ad-form .rte-basic-btn:hover{background:var(--gray-200)}
.ad-form .rte-basic-btn.is-active{background:var(--purple-100);color:var(--purple-800);box-shadow:none}
.ad-form .rte-basic .rte-basic-content{min-height:180px;padding:14px 16px;border:0;border-radius:0;outline:0;font-size:1rem;line-height:1.6;color:var(--color-heading)}
.ad-form .rte-basic.is-empty .ProseMirror[data-placeholder]::before{color:var(--gray-500);opacity:1}
.ad-form .is-invalid-group .chip,.ad-form .select.is-invalid,.ad-form .input.is-invalid{border-width:2px;border-color:var(--purple-800)}
@media (max-width: 767.98px){
.ad-form-layout{grid-template-areas:"main" "end"}
.form-end{padding-top:20px}
.form-end__phone{display:flex;flex-direction:column;gap:8px}
.upload .filepond--item{width:calc(50% - .5em)}
.ad-form .rte-basic-btn{min-width:44px;height:44px}
.site:has(.form-bar) .site-footer{padding-bottom:88px}
}