/*
Theme Name: Nordic Playtime
Theme URI: https://nordicplaytime.dk
Author: Nordic Playtime
Description: Et enkelt redigerbart bloktema til Nordic Playtime.
Version: 1.7.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: nordic-playtime
*/

html { scroll-behavior: smooth; }
body { overflow-x: hidden; text-rendering: optimizeLegibility; }
.np-aurora {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 18% 12%, rgba(74,222,128,.26), transparent 34%),
    radial-gradient(ellipse at 82% 10%, rgba(244,114,182,.22), transparent 34%),
    radial-gradient(ellipse at 50% 28%, rgba(34,211,238,.18), transparent 42%),
    linear-gradient(180deg,#071426 0%,#0f2943 58%,#193951 100%);
}
.np-aurora > .wp-block-group { position:relative; z-index:4; }

/* CSS-fallback: vises også når WordPress bruger en gemt ældre skabelon. */
.np-winter-scene { display:none !important; }
.np-aurora::after {
  content:""; position:absolute; z-index:1; left:0; right:0; top:315px; height:430px;
  pointer-events:none; opacity:.94; background-position:center bottom; background-size:cover; background-repeat:no-repeat;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 430' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='m' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop stop-color='%236d86a2'/%3E%3Cstop offset='1' stop-color='%23243b59'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 305V196L130 70l94 96L355 52l120 130L610 88l122 108L860 57l123 139 128-125 103 112 105-98 121 116v104z' fill='url(%23m)'/%3E%3Cpath d='M130 70l38 39 26-15 30 72-54-34-38 22-45 14 43-98zm225-18 38 42 32-14 50 102-67-63-38 25-67 24 52-116zm255 36 42 37 28-12 52 83-60-45-42 25-67 15 47-103zm250-31 40 46 30-15 53 108-73-66-41 28-61 18 52-119zm251 14 35 39 27-12 41 85-55-53-35 24-55 12 42-95zm208 14 33 34 25-10 63 92-67-57-37 25-57 10 36-94z' fill='%23eff9ff'/%3E%3Cpath d='M0 280q190-55 390 4t380 14q155-54 310 5t360-10v137H0z' fill='%23dcecf4'/%3E%3Cpath d='M0 280q190-55 390 4-190-35-390 12zm770 18q155-54 310 5 143 55 360-10v45q-205 38-382-8-148-39-288 8z' fill='%23f7fcff'/%3E%3Cg fill='%23246843'%3E%3Cpath d='M95 300l32-80 32 80zM1180 298l38-98 38 98zM1320 308l26-68 26 68z'/%3E%3C/g%3E%3Cg fill='%23eef9ff'%3E%3Cpath d='M105 270h44l-7-12h-32zM1193 258h50l-8-14h-34zM1331 282h32l-6-10h-20z'/%3E%3C/g%3E%3C/svg%3E");
}
.np-aurora > .wp-block-group::before {
  content:""; position:absolute; z-index:1; top:395px; left:7%; width:92px; height:68px; pointer-events:none;
  background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 72'%3E%3Cellipse cx='57' cy='41' rx='32' ry='22' fill='%23edf4f8'/%3E%3Ccircle cx='27' cy='31' r='19' fill='%23f7fbfd'/%3E%3Ccircle cx='16' cy='15' r='7' fill='%23dce8ee'/%3E%3Ccircle cx='37' cy='14' r='7' fill='%23dce8ee'/%3E%3Cellipse cx='25' cy='39' rx='11' ry='8' fill='%23e0eaf0'/%3E%3Ccircle cx='24' cy='36' r='3' fill='%23354a59'/%3E%3Ccircle cx='20' cy='27' r='2.5' fill='%23263746'/%3E%3Ccircle cx='34' cy='27' r='2.5' fill='%23263746'/%3E%3Ccircle cx='89' cy='35' r='7' fill='%23dce8ee'/%3E%3Crect x='35' y='53' width='13' height='18' rx='6' fill='%23d7e4ea'/%3E%3Crect x='55' y='53' width='13' height='18' rx='6' fill='%23d7e4ea'/%3E%3Crect x='72' y='50' width='12' height='19' rx='6' fill='%23d7e4ea'/%3E%3C/svg%3E");
  filter:drop-shadow(0 9px 7px rgba(0,0,0,.25)); animation:npBearCss 18s ease-in-out infinite;
}
@keyframes npBearCss { 0%{left:7%;transform:scaleX(1)}45%{left:78%;transform:scaleX(1)}50%{left:78%;transform:scaleX(-1)}95%{left:7%;transform:scaleX(-1)}100%{left:7%;transform:scaleX(1)} }

/* Vinterlandskab fra den oprindelige Nordic Playtime-side. */
.np-winter-scene { position:absolute; z-index:1; top:205px; left:0; width:100%; height:500px; pointer-events:none; opacity:.96; }
.np-mountains { position:absolute; inset:0 0 auto; width:100%; height:310px; filter:drop-shadow(0 20px 28px rgba(0,0,0,.14)); }
.np-snowfield { position:absolute; left:-2%; bottom:0; width:104%; height:235px; }
.np-pines { position:absolute; inset:0; }
.np-pine { position:absolute; bottom:125px; width:50px; height:105px; filter:drop-shadow(0 10px 10px rgba(0,0,0,.2)); }
.np-pine::before,.np-pine::after { content:""; position:absolute; left:50%; transform:translateX(-50%); width:0; height:0; border-left:24px solid transparent; border-right:24px solid transparent; border-bottom:48px solid #276b43; }
.np-pine::before { bottom:32px; }
.np-pine::after { bottom:8px; border-left-width:30px; border-right-width:30px; border-bottom-width:58px; border-bottom-color:#1f5b3a; }
.np-pine span { position:absolute; left:50%; bottom:0; width:7px; height:24px; transform:translateX(-50%); background:#785439; border-radius:3px; }
.np-pine span::before,.np-pine span::after { content:""; position:absolute; z-index:2; height:5px; border-radius:99px; background:#eff9ff; transform:rotate(-5deg); }
.np-pine span::before { width:44px; left:-19px; top:-24px; }
.np-pine span::after { width:34px; left:-14px; top:-49px; }
.np-pine-1 { left:5%; transform:scale(1.1); }.np-pine-2 { left:14%; transform:scale(.72); }.np-pine-3 { right:8%; transform:scale(1.25); }.np-pine-4 { right:19%; transform:scale(.82); }
.np-ice-path { position:absolute; left:24%; right:24%; bottom:83px; height:48px; border-radius:50% 50% 25% 25%; background:linear-gradient(180deg,rgba(194,242,255,.62),rgba(89,187,221,.18)); box-shadow:inset 0 2px rgba(255,255,255,.65); transform:perspective(300px) rotateX(52deg); }
.np-bear { position:absolute; left:27%; bottom:112px; width:86px; height:68px; animation:npBearWalk 18s ease-in-out infinite; filter:drop-shadow(0 10px 8px rgba(0,0,0,.2)); }
.np-bear-body { position:absolute; left:20px; bottom:14px; width:53px; height:37px; border-radius:50% 52% 43% 45%; background:linear-gradient(#f8fcff,#d9e5ed); }
.np-bear-head { position:absolute; left:5px; bottom:35px; width:35px; height:32px; border-radius:50%; background:linear-gradient(#f8fcff,#d9e5ed); animation:npBearHead .55s ease-in-out infinite; }
.np-bear-head::before,.np-bear-head::after { content:""; position:absolute; top:-3px; width:11px; height:11px; border-radius:50%; background:#d9e5ed; }
.np-bear-head::before { left:2px; }.np-bear-head::after { right:2px; }
.np-bear-face { position:absolute; left:8px; bottom:6px; width:19px; height:13px; border-radius:50%; background:#eef4f7; }
.np-bear-face::before { content:""; position:absolute; left:7px; top:1px; width:6px; height:5px; border-radius:50%; background:#34495a; }
.np-bear-eye { position:absolute; top:11px; width:4px; height:4px; border-radius:50%; background:#263746; box-shadow:20px 0 #263746; left:6px; }
.np-bear-tail { position:absolute; right:5px; bottom:29px; width:12px; height:12px; border-radius:50%; background:#e3edf3; }
.np-bear-leg { position:absolute; bottom:0; width:12px; height:22px; border-radius:0 0 8px 8px; background:#d4e1e9; transform-origin:top; }
.np-bear-leg.one { left:24px; animation:npLegA .55s ease-in-out infinite; }.np-bear-leg.two { left:41px; animation:npLegB .55s ease-in-out infinite; }.np-bear-leg.three { left:57px; animation:npLegA .55s ease-in-out infinite; }.np-bear-leg.four { left:70px; animation:npLegB .55s ease-in-out infinite; }
@keyframes npBearWalk { 0%{left:25%;transform:scaleX(1)}45%{left:66%;transform:scaleX(1)}50%{left:66%;transform:scaleX(-1)}95%{left:25%;transform:scaleX(-1)}100%{left:25%;transform:scaleX(1)} }
@keyframes npBearHead { 0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-2px)} }
@keyframes npLegA { 0%,100%{transform:rotate(-13deg)}50%{transform:rotate(13deg)} } @keyframes npLegB { 0%,100%{transform:rotate(13deg)}50%{transform:rotate(-13deg)} }
.np-aurora::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.58;
  background-image:
    radial-gradient(circle at 12% 22%,#fff 0 1px,transparent 1.5px),
    radial-gradient(circle at 28% 8%,#fff 0 1px,transparent 1.5px),
    radial-gradient(circle at 62% 18%,#fff 0 1px,transparent 1.5px),
    radial-gradient(circle at 86% 29%,#fff 0 1px,transparent 1.5px);
  background-size: 170px 160px,220px 190px,260px 210px,190px 230px;
}
.np-glass {
  position:relative; overflow:hidden;
  background:linear-gradient(145deg,rgba(17,32,52,.82),rgba(5,12,25,.64));
  border:1px solid rgba(255,255,255,.11); backdrop-filter:blur(18px);
  box-shadow:0 24px 70px rgba(0,0,0,.30),inset 0 1px rgba(255,255,255,.06);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.np-glass::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent); opacity:.45; }
.np-glass:hover { transform:translateY(-7px); border-color:rgba(255,255,255,.23); box-shadow:0 30px 80px rgba(0,0,0,.38); }
.np-pill a { border-radius:999px !important; box-shadow:0 12px 34px rgba(0,0,0,.26); transition:transform .2s ease,filter .2s ease; }
.np-pill a:hover { transform:translateY(-2px); filter:brightness(1.08); }
.np-small { opacity:.72; }
.np-gradient-text { background:linear-gradient(100deg,#fff 12%,#9fffe6 47%,#a7e9ff 74%,#ffd1e6); -webkit-background-clip:text; background-clip:text; color:transparent !important; }
.np-eyebrow { display:table; margin-inline:auto; padding:7px 13px; border:1px solid rgba(255,255,255,.13); border-radius:999px; background:rgba(255,255,255,.06); letter-spacing:.11em; text-transform:uppercase; font-size:12px; font-weight:800; }
.np-soft-section { background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); border-block:1px solid rgba(255,255,255,.07); }
.np-card-icon { width:56px; height:56px; display:grid; place-items:center; border-radius:16px; background:rgba(255,255,255,.08); font-size:28px; }
.np-subpage { min-height:70vh; background:linear-gradient(180deg,#071426,#102f4a); }
.np-subpage-card { height:100%; padding:28px !important; border-radius:20px; background:rgba(17,32,52,.82); border:1px solid rgba(255,255,255,.11); }
.np-subpage-card .wp-block-heading { margin-top:0; }
.np-category-page { min-height:100vh; position:relative; }
.np-category-page .aurora-wrap { position:fixed; height:100vh; }
.np-category-page > .wp-block-group { position:relative; z-index:7; }
.np-category-header { position:sticky; top:0; z-index:12; padding:22px 28px !important; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(8,18,34,.76); backdrop-filter:blur(16px); }
.np-category-header .wp-block-buttons { margin:0; }
.np-category-content { padding:48px 24px 90px !important; }
.np-featured-banner { padding:42px !important; border:1px solid rgba(34,211,238,.2); border-radius:24px; background:rgba(30,27,75,.58); backdrop-filter:blur(10px); }
.np-featured-emoji { font-size:72px; line-height:1; }
.np-card-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px !important; }
.np-content-card { min-height:230px; padding:0 !important; overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:18px; background:rgba(17,18,26,.78); backdrop-filter:blur(10px); transition:transform .25s ease,border-color .25s ease; }
.np-content-card:hover { transform:translateY(-6px); border-color:rgba(255,255,255,.24); }
.np-content-card .np-card-visual { display:grid; place-items:center; min-height:135px; margin:0 !important; font-size:56px; background:linear-gradient(135deg,rgba(30,32,48,.92),rgba(37,42,61,.92)); }
.np-content-card .np-card-copy { padding:20px !important; }
.np-content-card .wp-block-heading,.np-content-card p { margin-top:0; }
.np-tag-row { gap:8px !important; }
.np-tag-row .wp-block-button__link { padding:5px 11px !important; font-size:12px; }
.np-books-hero { padding:42px !important; border:1px solid rgba(251,146,60,.22); border-radius:24px; background:rgba(45,36,27,.6); text-align:center; backdrop-filter:blur(10px); }
.np-mini-card { padding:22px !important; border:1px solid rgba(255,255,255,.1); border-radius:16px; background:rgba(17,18,26,.78); }
.np-category-nav { position:fixed; z-index:20; right:22px; bottom:22px; padding:8px !important; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:rgba(17,18,26,.88); backdrop-filter:blur(16px); }
.np-category-nav .wp-block-button__link { padding:8px 14px !important; background:transparent !important; color:#ccd6f6 !important; }

/* PC: reproduce the preferred 150% browser-zoom look at normal 100% zoom. */
@media (min-width:1025px) {
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-aurora:not(.np-category-page) { min-height:100vh; padding-top:165px !important; }
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-aurora:not(.np-category-page) .aurora-wrap { height:100vh; }
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-aurora:not(.np-category-page) > .wp-block-group {
    width:66.6667%;
    max-width:none !important;
    margin-inline:auto !important;
    transform:scale(1.5);
    transform-origin:top center;
  }
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-aurora:not(.np-category-page) .pine-tree { scale:1.5; transform-origin:center bottom; }
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-aurora:not(.np-category-page) .walker { scale:calc(var(--np-bear-size,1) * 1.5); }
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .np-subpage > .wp-block-group { font-size:1.5em; }
}
@media (max-width:781px) {
  .np-category-header { position:relative; padding:18px !important; }
  .np-category-content { padding:34px 18px 80px !important; }
  .np-featured-banner,.np-books-hero { padding:26px !important; }
  .np-card-grid { grid-template-columns:1fr; }
  .np-category-nav { right:10px; bottom:10px; max-width:calc(100vw - 20px); }
}

.np-card-grid > .np-content-card {
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
}

/* Tablet: behold luft, men gør indholdet mere kompakt. */
@media (max-width: 1024px) {
  .np-aurora { background-position:center top; }
  .np-aurora > .wp-block-group { width:100%; }
  .np-glass { padding:26px 22px !important; }
  .wp-block-navigation__container { gap:14px; }
  .np-winter-scene { top:230px; transform:scale(1.08); transform-origin:center top; }
}

/* Mobil: stablede bokse, trykvenlige knapper og kortere afstande. */
@media (max-width: 781px) {
  .np-aurora { padding:72px 18px 64px !important; }
  .np-aurora .wp-block-columns { gap:18px; }
  .np-glass { width:100%; padding:26px 22px !important; }
  .np-pill { gap:12px; margin-top:30px !important; margin-bottom:58px !important; }
  .np-pill .wp-block-button { width:100%; }
  .np-pill .wp-block-button__link { width:100%; text-align:center; padding:14px 18px; }
  header .wp-block-group { gap:12px; }
  .wp-block-site-title { font-size:21px !important; }
  .np-winter-scene { top:250px; height:420px; opacity:.78; }
  .np-mountains { height:250px; }
  .np-snowfield { height:190px; }
  .np-pine { bottom:96px; transform:scale(.65); }
  .np-pine-3 { transform:scale(.82); }
  .np-ice-path { left:12%; right:12%; bottom:65px; }
  .np-bear { bottom:86px; transform:scale(.8); }
  @keyframes npBearWalk { 0%{left:8%;transform:scale(.78) scaleX(1)}45%{left:70%;transform:scale(.78) scaleX(1)}50%{left:70%;transform:scale(.78) scaleX(-1)}95%{left:8%;transform:scale(.78) scaleX(-1)}100%{left:8%;transform:scale(.78) scaleX(1)} }
  .np-aurora::after { top:325px; height:360px; }
  .np-aurora > .wp-block-group::before { top:410px; width:72px; height:54px; }
  @keyframes npBearCss { 0%{left:2%;transform:scaleX(1)}45%{left:74%;transform:scaleX(1)}50%{left:74%;transform:scaleX(-1)}95%{left:2%;transform:scaleX(-1)}100%{left:2%;transform:scaleX(1)} }
}

/* Små telefoner: undgå tekst og knapper, der løber ud over skærmen. */
@media (max-width: 420px) {
  .np-aurora { padding-left:14px !important; padding-right:14px !important; }
  .np-aurora h1 { font-size:clamp(2.65rem,15vw,4rem) !important; overflow-wrap:anywhere; }
  .np-glass { border-radius:18px !important; }
  footer.wp-block-template-part .wp-block-group { padding-left:16px !important; padding-right:16px !important; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.np-glass{transition:none}.np-bear,.np-bear-head,.np-bear-leg,.np-aurora>.wp-block-group::before{animation:none !important} }
