/* ============================================================
   Sejerø Oplevelser - frontend
   Palette og typografi følger Sejerø-designet: sand, sol, grøn,
   Fresca til overskrifter, Caveat til eyebrow, Manrope til brødtekst.
   ============================================================ */

.sjop{
	--sand:#E8DAC0;
	--sand-l:#F4ECDE;
	--sand-d:#D8C8A9;
	--driv:#5B4636;
	--driv-d:#3A2818;
	--sol:#E0A458;
	--sol-d:#C9863A;
	--gron:#1E342B;
	--gron-l:#2C4A3E;
	--cream:#FAF5EA;
	--ease:cubic-bezier(.23,1,.32,1);
	--container:1600px;
	--gutter:3%;

	position:relative;
	background:var(--sand);
	background-image:
		repeating-linear-gradient(45deg, rgba(58,40,24,.025) 0 1px, transparent 1px 14px),
		repeating-linear-gradient(-45deg, rgba(58,40,24,.025) 0 1px, transparent 1px 14px),
		radial-gradient(900px 700px at 85% 10%, rgba(224,164,88,.16), transparent 60%);
	font-family:'Manrope', system-ui, sans-serif;
	color:var(--driv-d);
	box-sizing:border-box;
}
.sjop *,
.sjop *::before,
.sjop *::after{box-sizing:border-box}
.sjop :where(h2,h3,p,ol,li){margin:0;padding:0}
.sjop ol{list-style:none}
/* color:inherit må IKKE stå her alene: .sjop a er 0,1,1 og slår
   klassereglerne på knapperne (0,1,0) ihjel. Derfor er farverne på
   alt der er et <a> sat med tag-kvalificerede selectorer nedenfor. */
.sjop a{text-decoration:none}
.sjop a:not([class]){color:inherit}
.sjop button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent;text-align:inherit}
.sjop .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

.sjop-wrap{max-width:var(--container);margin:0 auto;padding:clamp(70px,8vw,120px) var(--gutter)}

/* ---------- Overskrifter ---------- */

.sjop-eyebrow{
	display:inline-flex;align-items:center;gap:10px;
	font-family:'Caveat', cursive;font-weight:600;
	font-size:clamp(22px,2.2vw,28px);
	color:var(--sol-d);line-height:1;
}
.sjop-eyebrow::after{
	content:'';display:inline-block;width:60px;height:2px;border-radius:2px;
	background:linear-gradient(90deg, var(--sol) 0%, transparent 100%);
}
.sjop-eyebrow--center::before{
	content:'';display:inline-block;width:60px;height:2px;border-radius:2px;
	background:linear-gradient(-90deg, var(--sol) 0%, transparent 100%);
}
.sjop-h{
	font-family:'Fresca', Georgia, serif;font-weight:400;
	font-size:clamp(34px,4.5vw,58px);line-height:1.1;
	color:var(--gron);
	margin-top:clamp(10px,1.2vw,16px) !important;
}
.sjop-lead{
	font-family:'Manrope', sans-serif;font-weight:400;
	font-size:clamp(16px,1.2vw,18px);line-height:1.65;
	color:var(--driv-d);
	max-width:62ch;
	margin-top:clamp(14px,1.6vw,20px) !important;
}
.sjop-head{max-width:740px;margin:0 auto clamp(26px,3vw,40px);text-align:center}
.sjop-head .sjop-lead{margin-left:auto;margin-right:auto}

/* ---------- Værktøjslinje: søgning + filtre ---------- */

.sjop-toolbar{
	display:flex;flex-direction:column;align-items:center;gap:clamp(14px,1.8vw,22px);
	margin-bottom:clamp(26px,3vw,40px);
}

.sjop-search{
	position:relative;display:flex;align-items:center;
	width:min(440px,100%);
	background:var(--cream);border-radius:50px;
	box-shadow:inset 0 0 0 1px rgba(58,40,24,.12), 0 14px 30px -24px rgba(58,40,24,.5);
	transition:box-shadow .3s var(--ease);
}
.sjop-search:focus-within{box-shadow:inset 0 0 0 2px var(--sol), 0 18px 36px -22px rgba(58,40,24,.55)}
.sjop-search__ico{width:18px;height:18px;flex:0 0 auto;margin-left:18px;color:var(--sol-d)}
.sjop-search__input{
	flex:1;min-width:0;
	font-family:'Manrope', sans-serif;font-size:15px;font-weight:500;
	color:var(--driv-d);background:transparent;border:0;outline:none;
	padding:14px 10px;
}
.sjop-search__input::placeholder{color:rgba(58,40,24,.55)}
.sjop-search__input::-webkit-search-cancel-button{display:none}
.sjop-search__clear{
	display:grid;place-items:center;flex:0 0 auto;
	width:30px;height:30px;margin-right:10px;border-radius:50%;
	background:rgba(58,40,24,.08);color:var(--driv);
	transition:background-color .3s var(--ease)}
.sjop-search__clear svg{width:13px;height:13px}
.sjop-search__clear[hidden]{display:none}

.sjop-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.sjop-chip{
	display:inline-flex;align-items:center;gap:8px;
	padding:10px 16px 10px 18px;border-radius:50px;
	font-family:'Manrope', sans-serif;font-weight:600;font-size:14px;
	color:var(--driv-d);background:var(--cream);
	box-shadow:inset 0 0 0 1px rgba(58,40,24,.12);
	transition:transform .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease), color .3s var(--ease);
}
.sjop-chip__dot{width:9px;height:9px;border-radius:50%;background:var(--cc,#5B6B74);flex:0 0 auto}
.sjop-chip__n{
	font-size:11.5px;font-weight:700;letter-spacing:.02em;
	padding:2px 7px;border-radius:20px;
	background:rgba(58,40,24,.09);color:var(--driv);
	transition:background-color .3s var(--ease), color .3s var(--ease);
}
.sjop-chip.is-on{
	background:linear-gradient(135deg, var(--gron) 0%, var(--gron-l) 100%);
	color:var(--cream);
	box-shadow:0 12px 26px -12px rgba(30,52,43,.5);
}
.sjop-chip.is-on .sjop-chip__dot{box-shadow:0 0 0 2px rgba(250,245,234,.35)}
.sjop-chip.is-on .sjop-chip__n{background:rgba(250,245,234,.2);color:var(--cream)}

/* ---------- Grid ----------
   Billederne er af svingende kvalitet, så de vises aldrig store. Hvert
   kort er en redaktionel række med et lille kvadratisk thumbnail, og
   alle billeder får den samme varme tone, så et sæt uens fotos læses
   som én serie i stedet for tolv forskellige. Tonen trækker sig ved
   hover, så man kan se det rigtige billede. */
.sjop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.2vw,16px)}

.sjop-card{
	position:relative;display:grid;
	grid-template-columns:auto minmax(0,1fr) auto;
	align-items:center;gap:clamp(14px,1.3vw,18px);
	padding:clamp(12px,1.1vw,16px);
	border-radius:16px;background:var(--cream);cursor:pointer;overflow:hidden;
	box-shadow:0 14px 30px -26px rgba(58,40,24,.6);
	transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-color .35s var(--ease);
}
.sjop-card.is-wide{grid-column:span 2}
.sjop-card.is-hidden{display:none}
.sjop-card:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sol), 0 20px 40px -26px rgba(58,40,24,.6)}

/* Venstre accent i kategoriens farve. Fast på de fremhævede, glider ind ved hover. */
.sjop-card::before{
	content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;
	border-radius:0 3px 3px 0;background:var(--mc,#5B6B74);
	transform:scaleY(0);transform-origin:center;
	transition:transform .35s var(--ease);
}
.sjop-card.is-wide::before{transform:scaleY(1)}

.sjop-card__media{
	position:relative;flex:0 0 auto;
	width:clamp(78px,6.6vw,98px);aspect-ratio:1;
	border-radius:13px;overflow:hidden;background:var(--sand-d);
}
.sjop-card.is-wide .sjop-card__media{width:clamp(94px,8.2vw,122px)}
.sjop-card__media img{
	width:100%;height:100%;object-fit:cover;display:block;
	filter:saturate(.7) contrast(1.06);
	transition:filter .5s var(--ease), transform .6s var(--ease);
}
.sjop-card__tint{
	position:absolute;inset:0;pointer-events:none;
	background:linear-gradient(150deg, rgba(224,164,88,.4), rgba(30,52,43,.52));
	mix-blend-mode:multiply;
	transition:opacity .5s var(--ease);
}
.sjop-card__glyph{
	position:absolute;inset:0;display:grid;place-items:center;
	color:var(--gron);background:linear-gradient(150deg,var(--sand-l),var(--sand-d));
}
.sjop-card__glyph svg{width:44%;height:44%}

.sjop-card__body{min-width:0}
.sjop-card__cat{
	display:inline-flex;align-items:center;gap:7px;
	font-size:12px;font-weight:700;color:var(--mc,#5B6B74);
}
.sjop-card__dot{width:8px;height:8px;border-radius:50%;background:var(--mc,#5B6B74);flex:0 0 auto}
.sjop-card__title{
	font-family:'Fresca', Georgia, serif;font-weight:400;
	font-size:clamp(18px,1.5vw,22px);line-height:1.15;color:var(--gron);margin-top:4px;
}
.sjop-card.is-wide .sjop-card__title{font-size:clamp(20px,1.8vw,26px)}
.sjop-card__desc{
	font-size:13.5px;line-height:1.5;color:var(--driv-d);margin-top:5px;
	display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sjop-card.is-wide .sjop-card__desc{-webkit-line-clamp:3}
.sjop-card__note{display:block;margin-top:6px;font-size:12.5px;font-style:italic;color:var(--driv)}

.sjop-card__side{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.sjop-card__go{
	display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
	color:var(--sol-d);background:rgba(224,164,88,.18);
	transition:transform .35s var(--ease), background-color .35s var(--ease), color .35s var(--ease);
}
.sjop-card__go svg{width:15px;height:15px}

.sjop-pin{
	display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
	background:rgba(58,40,24,.07);color:var(--gron);
	transition:transform .3s var(--ease), background-color .3s var(--ease), color .3s var(--ease);
}
.sjop-pin svg{width:14px;height:14px}
.sjop-pin__on{display:none}
.sjop-pin[aria-pressed="true"]{background:var(--gron);color:var(--sol)}
.sjop-pin[aria-pressed="true"] .sjop-pin__add{display:none}
.sjop-pin[aria-pressed="true"] .sjop-pin__on{display:block}

.sjop-empty{
	margin-top:clamp(26px,3vw,40px) !important;text-align:center;
	font-family:'Manrope', sans-serif;font-size:16px;color:var(--driv-d);
}
.sjop-empty[hidden]{display:none}
.sjop-empty__reset{
	font-weight:700;color:var(--sol-d);
	box-shadow:inset 0 -1px 0 var(--sol-d);
	padding:0;
}

/* ---------- Forklaring ---------- */

.sjop-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 22px;margin-top:clamp(26px,3vw,38px)}
.sjop-legend__item{display:inline-flex;align-items:center;gap:8px;font-family:'Manrope', sans-serif;font-size:13px;color:var(--driv-d)}
.sjop-legend__dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}

/* ---------- Vandreruter ---------- */

.sjop-routes{margin-top:clamp(50px,6vw,84px)}
.sjop-routes__head{max-width:640px;margin:0 auto clamp(24px,2.8vw,38px);text-align:center}
.sjop-routes__head .sjop-lead{margin-left:auto;margin-right:auto;font-size:15px}
.sjop-routes__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.4vw,18px)}
.sjop-route{
	display:flex;align-items:center;gap:clamp(14px,1.6vw,20px);width:100%;
	padding:clamp(16px,1.8vw,22px) clamp(18px,2vw,26px);
	background:var(--cream);border-radius:clamp(14px,1.6vw,18px);
	box-shadow:inset 5px 0 0 var(--rc,#9A8463), 0 18px 44px -28px rgba(58,40,24,.4), inset 0 0 0 1px rgba(58,40,24,.07);
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.sjop-route__km{
	flex:0 0 auto;min-width:clamp(64px,7vw,88px);
	font-family:'Fresca', Georgia, serif;font-size:clamp(20px,1.8vw,26px);
	color:var(--rc,var(--sol-d));line-height:1.05;
}
.sjop-route__main{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.sjop-route__name{font-family:'Manrope', sans-serif;font-weight:600;font-size:15.5px;line-height:1.25;color:var(--gron)}
.sjop-route__desc{font-family:'Manrope', sans-serif;font-weight:400;font-size:13px;line-height:1.45;color:var(--driv-d)}
.sjop-route__meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:5px}
.sjop-route__color{display:inline-flex;align-items:center;gap:6px;font-family:'Manrope', sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.03em;color:var(--rc)}
.sjop-route__dot{width:11px;height:11px;border-radius:50%;background:var(--rc);box-shadow:0 0 0 2px color-mix(in srgb, var(--rc) 22%, transparent)}
.sjop-route__diff{font-family:'Manrope', sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--driv)}
.sjop-route__arrow{width:18px;height:18px;flex:0 0 auto;color:var(--sol-d);transition:transform .3s var(--ease)}

/* ---------- Knapper ---------- */

.sjop-btn{
	display:inline-flex;align-items:center;gap:9px;
	padding:13px 24px;border-radius:50px;
	font-family:'Manrope', sans-serif;font-weight:600;font-size:14.5px;
	transition:transform .3s var(--ease), box-shadow .3s var(--ease), background-color .3s var(--ease);
}
.sjop-btn svg{width:16px;height:16px}
.sjop a.sjop-btn--primary,
.sjop-btn--primary{
	background:linear-gradient(135deg, var(--gron) 0%, var(--gron-l) 100%);
	color:var(--hvid);
	box-shadow:0 16px 34px -14px rgba(30,52,43,.55);
}
.sjop a.sjop-btn--ghost,
.sjop-btn--ghost{
	background:rgba(58,40,24,.06);color:var(--driv-d);
	box-shadow:inset 0 0 0 1px rgba(58,40,24,.16);
}
.sjop-btn[hidden]{display:none}

/* ---------- Popup ---------- */

.sjop-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
.sjop-modal[hidden]{display:none}
.sjop-modal__overlay{position:absolute;inset:0;background:rgba(30,52,43,.55);backdrop-filter:blur(3px);opacity:0;transition:opacity .3s var(--ease)}
.sjop-modal.is-open .sjop-modal__overlay{opacity:1}
.sjop-modal__box{
	position:relative;z-index:1;width:100%;max-width:520px;max-height:90vh;overflow:auto;
	background:var(--cream);border-radius:clamp(16px,2vw,24px);
	box-shadow:0 40px 90px -30px rgba(30,52,43,.7);
	transform:translateY(16px) scale(.98);opacity:0;
	transition:transform .35s var(--ease), opacity .35s var(--ease);
	--mc:#5B6B74;
}
.sjop-modal.is-open .sjop-modal__box{transform:none;opacity:1}
.sjop-modal__close{
	position:absolute;top:14px;right:14px;z-index:3;
	display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
	background:rgba(250,245,234,.92);color:var(--driv);
	box-shadow:0 8px 18px -6px rgba(58,40,24,.5);
	transition:transform .25s var(--ease), background-color .25s var(--ease);
}
.sjop-modal__close svg{width:17px;height:17px}
.sjop-modal__media{aspect-ratio:16/9;overflow:hidden;background:var(--sand-d)}
.sjop-modal__media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9) contrast(1.04)}
.sjop-modal__media.is-empty{display:none}
.sjop-modal__body{padding:clamp(22px,3vw,30px)}
.sjop-modal__cat{
	display:inline-block;
	font-family:'Manrope', sans-serif;font-weight:600;font-size:11px;
	letter-spacing:.06em;text-transform:uppercase;
	color:#fff;background:var(--mc);padding:5px 12px;border-radius:30px;
}
.sjop-modal__cat:empty{display:none}
.sjop-modal__title{
	font-family:'Fresca', Georgia, serif;font-weight:400;
	font-size:clamp(26px,3vw,34px);line-height:1.12;color:var(--gron);
	margin-top:12px !important;
}
.sjop-modal__addr{
	display:flex;align-items:flex-start;gap:8px;margin-top:10px !important;
	font-family:'Manrope', sans-serif;font-size:14.5px;font-weight:500;color:var(--driv);
}
.sjop-modal__addr svg{width:17px;height:17px;color:var(--mc);flex:0 0 auto;margin-top:1px}
.sjop-modal__addr[hidden]{display:none}
.sjop-modal__desc{
	margin-top:14px !important;
	font-family:'Manrope', sans-serif;font-weight:400;font-size:15px;line-height:1.65;color:var(--driv-d);
}
.sjop-modal__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(18px,2.2vw,24px)}
.sjop-modal__note{
	display:block;margin-top:18px;
	font-family:'Manrope', sans-serif;font-size:14px;font-weight:500;font-style:italic;color:var(--driv);
}
.sjop-modal__note[hidden]{display:none}

/* ---------- Vandrefolder ---------- */

.sjop-pdf{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:clamp(8px,1.5vw,22px)}
.sjop-pdf[hidden]{display:none}
.sjop-pdf__overlay{position:absolute;inset:0;background:rgba(30,52,43,.6);backdrop-filter:blur(3px);opacity:0;transition:opacity .3s var(--ease)}
.sjop-pdf.is-open .sjop-pdf__overlay{opacity:1}
.sjop-pdf__box{
	position:relative;z-index:1;width:100%;max-width:min(1700px,97vw);height:90vh;
	display:flex;flex-direction:column;overflow:hidden;
	background:var(--cream);border-radius:clamp(14px,1.6vw,20px);
	box-shadow:0 40px 90px -30px rgba(30,52,43,.7);
	transform:translateY(16px) scale(.985);opacity:0;
	transition:transform .35s var(--ease), opacity .35s var(--ease);
}
.sjop-pdf.is-open .sjop-pdf__box{transform:none;opacity:1}
.sjop-pdf__bar{
	display:flex;align-items:center;gap:14px;
	padding:12px 14px 12px 20px;
	background:linear-gradient(135deg, var(--gron) 0%, var(--gron-l) 100%);
	color:var(--cream);
}
.sjop-pdf__title{font-family:'Fresca', Georgia, serif;font-size:clamp(17px,1.6vw,21px);flex:1;line-height:1.1}
.sjop a.sjop-pdf__ext,
.sjop-pdf__ext{
	display:inline-flex;align-items:center;gap:7px;
	font-family:'Manrope', sans-serif;font-weight:600;font-size:13px;color:var(--sol);
	padding:8px 14px;border-radius:50px;background:rgba(250,245,234,.12);
	transition:background-color .25s var(--ease);
}
.sjop-pdf__ext svg{width:14px;height:14px}
.sjop-pdf__close{
	display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:50%;
	background:rgba(250,245,234,.14);color:var(--cream);
	transition:transform .25s var(--ease), background-color .25s var(--ease);
}
.sjop-pdf__close svg{width:16px;height:16px}
.sjop-pdf__frame{flex:1;background:var(--sand-d);min-height:0}
.sjop-pdf__frame iframe{width:100%;height:100%;border:0;display:block}

/* ---------- Dagsplan ---------- */

.sjop-plan{
	position:fixed;left:50%;bottom:clamp(14px,2.5vw,28px);z-index:900;
	transform:translateX(-50%);
	width:min(760px, calc(100vw - 28px));
	font-family:'Manrope', sans-serif;
}
.sjop-plan[hidden]{display:none}
.sjop-plan__bar{
	display:flex;align-items:center;gap:12px;
	padding:10px 10px 10px 22px;border-radius:50px;
	background:linear-gradient(135deg, var(--gron) 0%, var(--gron-l) 100%);
	color:var(--cream);
	box-shadow:0 26px 54px -20px rgba(30,52,43,.75);
}
.sjop-plan__count{font-weight:700;font-size:14px;flex:0 0 auto}
.sjop-plan__n{color:var(--sol)}
.sjop-plan__names{
	flex:1;min-width:0;font-size:13px;font-weight:400;color:rgba(250,245,234,.85);
	white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sjop-plan__toggle{
	flex:0 0 auto;font-size:13px;font-weight:600;color:var(--cream);
	padding:9px 14px;border-radius:50px;background:rgba(250,245,234,.14);
	transition:background-color .3s var(--ease);
}
.sjop a.sjop-plan__go,
.sjop-plan__go{
	display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;
	font-size:13.5px;font-weight:700;color:var(--gron);
	padding:11px 20px;border-radius:50px;
	background:linear-gradient(135deg, var(--sol) 0%, var(--sol-d) 100%);
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.sjop-plan__go svg{width:15px;height:15px}
.sjop-plan__panel{
	margin-top:10px;padding:16px 18px;border-radius:20px;
	background:var(--cream);color:var(--driv-d);
	box-shadow:0 26px 54px -22px rgba(58,40,24,.6), inset 0 0 0 1px rgba(58,40,24,.08);
	max-height:44vh;overflow:auto;
}
.sjop-plan__panel[hidden]{display:none}
.sjop-plan__list{display:flex;flex-direction:column;gap:2px}
.sjop-plan__item{display:flex;align-items:center;gap:12px;padding:9px 4px;font-size:14.5px;font-weight:500}
.sjop-plan__item + .sjop-plan__item{box-shadow:inset 0 1px 0 rgba(58,40,24,.09)}
.sjop-plan__num{
	flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;
	background:var(--gron);color:var(--sol);font-size:12px;font-weight:700;
}
.sjop-plan__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sjop-plan__remove{
	flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
	background:rgba(58,40,24,.07);color:var(--driv);
	transition:background-color .3s var(--ease), color .3s var(--ease);
}
.sjop-plan__remove svg{width:13px;height:13px}
.sjop-plan__clear{
	margin-top:12px;font-size:13px;font-weight:600;color:var(--sol-d);
	box-shadow:inset 0 -1px 0 var(--sol-d);
}

/* ---------- Hover ---------- */

@media (hover:hover) and (pointer:fine){
	.sjop-chip:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(224,164,88,.55)}
	.sjop-chip.is-on:hover{box-shadow:0 16px 30px -12px rgba(30,52,43,.6)}
	.sjop-search__clear:hover{background:rgba(58,40,24,.16)}

	.sjop-card:hover{transform:translateY(-2px);background:#FFF3E1;box-shadow:0 22px 44px -26px rgba(58,40,24,.65)}
	.sjop-card:hover::before{transform:scaleY(1)}
	.sjop-card:hover .sjop-card__media img{filter:none;transform:scale(1.07)}
	.sjop-card:hover .sjop-card__tint{opacity:.2}
	.sjop-card:hover .sjop-card__go{background:var(--sol);color:var(--gron);transform:translateX(3px)}

	.sjop-pin:hover{transform:scale(1.08);background:rgba(58,40,24,.14)}
	.sjop-pin[aria-pressed="true"]:hover{background:var(--gron-l)}

	.sjop-route:hover{transform:translateY(-3px);box-shadow:inset 5px 0 0 var(--rc,#9A8463), 0 24px 54px -28px rgba(58,40,24,.5), inset 0 0 0 1px rgba(224,164,88,.3)}
	.sjop-route:hover .sjop-route__arrow{transform:translateX(3px)}
	.sjop-btn--primary:hover{transform:translateY(-2px);box-shadow:0 22px 44px -14px rgba(30,52,43,.7)}
	.sjop-btn--ghost:hover{background:rgba(58,40,24,.12)}
	.sjop-modal__close:hover{transform:scale(1.08);background:var(--cream)}
	.sjop-pdf__ext:hover{background:rgba(250,245,234,.24)}
	.sjop-pdf__close:hover{transform:scale(1.08);background:rgba(250,245,234,.26)}
	.sjop-plan__toggle:hover{background:rgba(250,245,234,.24)}
	.sjop-plan__go:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(224,164,88,.8)}
	.sjop-plan__remove:hover{background:rgba(211,58,44,.14);color:#B3392C}
}

/* ---------- Responsivt ---------- */

@media (max-width:1240px){
	.sjop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:880px){
	.sjop-routes__list{grid-template-columns:1fr}
}
@media (max-width:760px){
	.sjop{--gutter:6%}
	.sjop-grid{grid-template-columns:1fr;gap:10px}
	.sjop-card.is-wide{grid-column:span 1}
	.sjop-card__title{font-size:19px}
	.sjop-plan__names{display:none}
}
@media (max-width:600px){
	.sjop-pdf__title{display:none}
	.sjop-pdf__box{height:92vh}
	.sjop-plan__bar{padding-left:16px;gap:8px}
	.sjop-plan__count{font-size:13px}
	.sjop-plan__go{padding:11px 16px}
}
@media (max-width:430px){
	.sjop-card__desc{-webkit-line-clamp:2}
	.sjop-card__media{width:70px}
	.sjop-card.is-wide .sjop-card__media{width:70px}
	.sjop-pin{display:none}
	.sjop-chip{padding:9px 12px 9px 14px;font-size:13px}
	.sjop-plan__toggle{display:none}
}

/* ---------- Reveal ---------- */

.sjop-up{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease), transform .8s var(--ease)}
.sjop.is-ready .sjop-up{opacity:1;transform:none}
.sjop.is-ready .sjop-grid .sjop-card{transition-delay:calc(var(--i,0) * 40ms)}

@media (prefers-reduced-motion:reduce){
	.sjop-up{transition:none;opacity:1;transform:none}
	.sjop *,
	.sjop *::before,
	.sjop *::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}