/* =====================================================================
   THEME · EDITORIAL & COMMERCIAL
   Sleek, minimalist. Charcoal + white, single electric-blue accent.
   Scoped under body.theme-editorial.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700;800;900&display=swap');

body.theme-editorial {
  --char: #141414;
  --char-2: #1d1d1d;
  --white: #ffffff;
  --off: #f3f3f1;
  --blue: #1f4eff;
  --grey: #8a8a8a;
  --eline: rgba(20,20,20,0.12);

  background: var(--white);
  color: var(--char);
  font-family: 'Schibsted Grotesk', system-ui, sans-serif;
}
body.theme-editorial h1, body.theme-editorial h2,
body.theme-editorial h3, body.theme-editorial h4 {
  font-family: 'Schibsted Grotesk', sans-serif;
  font-weight: 800; letter-spacing: -0.03em; line-height: .98;
}
body.theme-editorial .eyebrow { color: var(--blue); letter-spacing: .34em; }
body.theme-editorial ::selection { background: var(--blue); color: #fff; }

/* Hero */
.ed-hero {
  background: var(--char); color: var(--white);
  padding-top: calc(var(--header-h) + clamp(3rem,8vw,6rem));
  padding-bottom: clamp(3rem,8vw,6rem);
  position: relative; overflow: hidden;
}
.ed-hero::before {
  content:""; position:absolute; right:-5%; top:-20%; width:55%; height:140%;
  background: var(--blue); filter: blur(0); clip-path: polygon(30% 0,100% 0,100% 100%,0 100%);
  opacity:.0;
}
.ed-hero__tag { color: var(--blue); font-size:.74rem; letter-spacing:.34em; text-transform:uppercase; font-weight:700; }
.ed-hero h1 { font-size: clamp(3rem, 11vw, 9rem); margin-top: 1rem; text-transform: uppercase; }
.ed-hero h1 .blue { color: var(--blue); }
.ed-hero__sub { margin-top: 1.6rem; max-width: 52ch; color: rgba(255,255,255,0.7); font-size: clamp(1rem,1.6vw,1.2rem); }
.ed-hero__row { margin-top: 2.4rem; display:flex; gap:1rem; flex-wrap:wrap; }

.ed-btn { display:inline-flex; align-items:center; gap:.55rem; padding:.95rem 1.7rem; font-weight:700; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; transition:transform .3s var(--ease), background .3s, color .3s; }
.ed-btn--blue { background: var(--blue); color:#fff; }
.ed-btn--blue:hover { transform: translateY(-2px); background:#fff; color: var(--char); }
.ed-btn--line { border:1.5px solid currentColor; color:#fff; }
.ed-btn--line:hover { background:#fff; color: var(--char); }
.ed-btn .arrow { transition: transform .3s var(--ease); }
.ed-btn:hover .arrow { transform: translateX(4px); }

/* Section head */
.ed-head h2 { font-size: clamp(2rem, 6vw, 4.5rem); text-transform: uppercase; }
.ed-head h2 .blue { color: var(--blue); }
.ed-head p { margin-top: 1rem; color: var(--grey); max-width: 54ch; }

/* Grid portfolio */
.ed-grid { display:grid; grid-template-columns: repeat(12, 1fr); gap: 10px; }
.ed-cell { position:relative; overflow:hidden; background:var(--off); }
.ed-cell .media { position:absolute; inset:0; filter: grayscale(1) contrast(1.05); transition: filter .5s, transform .8s var(--ease); }
.ed-cell:hover .media { filter: grayscale(0); transform: scale(1.04); }
.ed-cell::after { content:""; position:absolute; inset:0; background: var(--blue); mix-blend-mode: screen; opacity:0; transition:opacity .4s; }
.ed-cell:hover::after { opacity:.12; }
.ed-cell__cap { position:absolute; left:0; bottom:0; z-index:2; padding:1.1rem 1.2rem; color:#fff; opacity:0; transform:translateY(8px); transition:all .4s var(--ease); }
.ed-cell:hover .ed-cell__cap { opacity:1; transform:none; }
.ed-cell__cap span { color:var(--blue); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700; }
.ed-cell__cap h4 { font-size:1.25rem; font-weight:700; }
.ed-cell.c6 { grid-column: span 6; aspect-ratio: 3/2; }
.ed-cell.c4 { grid-column: span 4; aspect-ratio: 3/4; }
.ed-cell.c8 { grid-column: span 8; aspect-ratio: 16/9; }
.ed-cell.c3 { grid-column: span 3; aspect-ratio: 3/4; }
@media (max-width: 760px){
  .ed-cell.c6,.ed-cell.c4,.ed-cell.c8,.ed-cell.c3 { grid-column: span 12; aspect-ratio: 4/3; }
}

/* Packages */
.ed-pkgs { display:grid; grid-template-columns: repeat(3,1fr); gap:1.2rem; }
@media (max-width: 900px){ .ed-pkgs { grid-template-columns:1fr; } }
.ed-pkg { border:1.5px solid var(--eline); padding:2.2rem; display:flex; flex-direction:column; transition: transform .4s var(--ease), box-shadow .4s; background:var(--white); }
.ed-pkg:hover { transform: translateY(-6px); box-shadow: 0 24px 60px rgba(0,0,0,0.08); }
.ed-pkg--feature { background: var(--char); color:#fff; border-color: var(--char); }
.ed-pkg__badge { font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700; color:var(--blue); }
.ed-pkg__name { font-size:1.8rem; font-weight:800; margin:.5rem 0 .2rem; text-transform:uppercase; }
.ed-pkg__price { font-size:2.6rem; font-weight:800; letter-spacing:-.03em; }
.ed-pkg__price small { font-size:.9rem; font-weight:500; color:var(--grey); }
.ed-pkg--feature .ed-pkg__price small { color: rgba(255,255,255,0.6); }
.ed-pkg__list { margin:1.4rem 0; display:grid; gap:.7rem; }
.ed-pkg__list li { padding-left:1.4rem; position:relative; font-size:.95rem; }
.ed-pkg__list li::before { content:"+"; position:absolute; left:0; color:var(--blue); font-weight:800; }
.ed-pkg .ed-btn { margin-top:auto; justify-content:center; width:100%; }
.ed-pkg:not(.ed-pkg--feature) .ed-btn--blue { background: var(--char); }
.ed-pkg:not(.ed-pkg--feature) .ed-btn--blue:hover { background: var(--blue); color:#fff; }

/* Booking / form block */
.ed-book { background: var(--off); }
.ed-book__grid { display:grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2rem,6vw,5rem); }
@media (max-width: 880px){ .ed-book__grid { grid-template-columns:1fr; } }
body.theme-editorial .field input,
body.theme-editorial .field textarea,
body.theme-editorial .field select { border-bottom-color: rgba(20,20,20,0.2); }
body.theme-editorial .field input:focus,
body.theme-editorial .field textarea:focus,
body.theme-editorial .field select:focus { border-color: var(--blue); }
body.theme-editorial .field label { color: var(--grey); }
body.theme-editorial .form__ok { background: rgba(31,78,255,0.1); border-left-color: var(--blue); }

/* Footer accent on editorial */
body.theme-editorial .footer { background: var(--char); }
body.theme-editorial .footer__col h5 { color: var(--blue); }
body.theme-editorial .footer__col a:hover { color: var(--blue); }
body.theme-editorial .footer__bottom a:hover { color: var(--blue); }
body.theme-editorial .logo__mark { border-color: var(--blue); color: var(--blue); }