/*
Theme Name: Neoporas
Theme URI: https://neoporas.lt
Author: Neoporas Team
Description: Šviesi, erdvi ir SKAITOMA tema. Tvirtas kontrastas, mobilūs „gutteriai“, suvaldyti Bulma/Gutenberg utilitai.
Version: 2.0.1
Text Domain: neoporas
*/

:root{
  color-scheme: light;
  --np-bg:#f7f8fa;
  --np-surface:#ffffff;
  --np-text:#0b1220;
  --np-muted:#364152;
  --np-border:#e5e7eb;
  --np-accent:#1d4ed8;
  --np-accent-contrast:#ffffff;
  --np-radius:16px;
  --np-radius-sm:12px;
  --np-shadow:0 1px 2px rgba(16,24,40,.05),0 8px 24px rgba(16,24,40,.07);
  --np-shadow-sm:0 1px 2px rgba(16,24,40,.04),0 4px 12px rgba(16,24,40,.06);
  --np-gutter:16px;
  --np-gutter-md:20px;
  --np-gutter-lg:24px;
  --np-leading:1.65;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--np-bg);color:var(--np-text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  line-height:var(--np-leading);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}

/* Gutteriai */
.container{max-width:1200px;padding-left:max(var(--np-gutter),env(safe-area-inset-left));padding-right:max(var(--np-gutter),env(safe-area-inset-right))}
@media (min-width:768px){.container{padding-left:var(--np-gutter-md);padding-right:var(--np-gutter-md)}}
@media (min-width:1024px){.container{padding-left:var(--np-gutter-lg);padding-right:var(--np-gutter-lg)}}

a{text-decoration:none;color:var(--np-accent)}
a:hover{text-decoration:underline;text-underline-offset:2px}
img{max-width:100%;height:auto;border-radius:12px}

/* Tamsus tekstas visur (išskyrus dark konteinerius) */
p,li,dt,dd,small,span,label,figcaption,th,td,
.content,.entry-content,.title,.subtitle,
.card,.box,.notification,.navbar,.hero,footer.section{color:var(--np-text)}
.subtitle{color:var(--np-muted)}
strong,b{color:var(--np-text);font-weight:700}

/* Antraštės */
h1,.title.is-1{font-weight:700;letter-spacing:-.01em;font-size:clamp(2rem,1.4rem + 2vw,3rem);color:var(--np-text)}
h2,.title.is-2{font-weight:700;letter-spacing:-.01em;font-size:clamp(1.75rem,1.2rem + 1.5vw,2.25rem);color:var(--np-text)}
h3,.title.is-3{font-weight:600;font-size:clamp(1.4rem,1.05rem + 1vw,1.75rem);color:var(--np-text)}
h4,.title.is-4,h5,.title.is-5,h6,.title.is-6{font-weight:600;color:var(--np-text)}
.entry-title,.page-title,.post-title{color:var(--np-text)}

/* Header/Nav */
.np-header{position:sticky;top:0;z-index:40;background:var(--np-surface);border-bottom:1px solid var(--np-border);transition:box-shadow .2s,border-color .2s}
.np-header.is-scrolled{box-shadow:var(--np-shadow);border-bottom-color:transparent}
.np-brand{display:inline-flex;flex-direction:column;margin-left:.5rem}
.np-brand__title{font-weight:600;font-size:1.125rem;color:var(--np-text)}
.np-brand__subtitle{font-size:.8125rem;color:var(--np-muted)}
.navbar{background:transparent}
.navbar.is-spaced{padding-top:.5rem;padding-bottom:.5rem}
.navbar .navbar-item,.navbar .navbar-link{color:var(--np-text);border-radius:10px}
.navbar .navbar-item:hover,.navbar .navbar-link:hover{background:#eef2f6;color:var(--np-text);text-decoration:none}
.navbar-burger{color:var(--np-text)}

/* Spacing */
.np-main{padding-top:1.25rem;padding-bottom:2.5rem}
.np-main>.container{padding-bottom:1rem}
@media (min-width:1024px){.np-main{padding-bottom:4rem}}
footer.section{margin-top:2.75rem;padding-top:3rem;background:var(--np-surface);border-top:1px solid var(--np-border)}

/* Kortelės/komponentai */
.card,.box,.notification{background:var(--np-surface);color:var(--np-text);border:1px solid var(--np-border);border-radius:16px;box-shadow:var(--np-shadow-sm)}
.card .card-content{padding:1.25rem}
.card:hover{box-shadow:var(--np-shadow)}
.hero.is-link.is-light{background:linear-gradient(180deg,#f8fafc 0%,#ffffff 60%);border:1px solid var(--np-border);border-radius:16px;box-shadow:var(--np-shadow-sm)}
.hero .title,.hero .subtitle{color:var(--np-text)}

/* Blockquote */
.content blockquote,.wp-block-quote,blockquote{position:relative;margin:1.25rem 0;padding:1rem 1.25rem 1rem 1.1rem;background:var(--np-surface);color:var(--np-text);border-left:4px solid var(--np-accent);border-radius:12px;box-shadow:var(--np-shadow-sm)}
.content blockquote p,.wp-block-quote p,blockquote p{margin:0 0 .75rem 0;color:inherit}
.wp-block-quote cite,blockquote cite,blockquote footer{display:block;margin-top:.25rem;font-size:.9em;opacity:.85}
.content blockquote a,.wp-block-quote a,blockquote a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* Lentelės */
.entry-content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;border-spacing:0}
.entry-content table th,.entry-content table td{padding:.5rem .75rem;border-bottom:1px solid var(--np-border)}

/* Formos/mygtukai */
:root{--np-input-bg:#ffffff;--np-input-text:var(--np-text);--np-input-border:var(--np-border);--np-input-placeholder:#6b7280;--np-input-focus:#1d4ed8;--np-danger:#ef4444}
.np-form{display:grid;gap:1rem 1.25rem}
@media (min-width:768px){.np-form.np-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.np-form.np-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.np-input-group{display:flex;flex-direction:column;gap:.4rem}
.np-input-inline{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.np-label,.comment-form label,label{font-weight:600;color:var(--np-text)}
.np-required::after{content:" *";color:var(--np-danger)}
.input,.textarea,.select select,input[type="text"],input[type="email"],input[type="url"],input[type="password"],input[type="search"],input[type="tel"],input[type="number"],input[type="date"],input[type="time"],input[type="file"],textarea,select{width:100%;background:var(--np-input-bg);color:var(--np-input-text);border:1px solid var(--np-input-border);border-radius:12px;padding:.7rem .9rem;line-height:1.4;box-shadow:0 0 0 rgba(0,0,0,0);transition:border-color .15s,box-shadow .15s,background-color .15s}
textarea,.textarea{min-height:140px;resize:vertical}
.input::placeholder,.textarea::placeholder,input::placeholder,textarea::placeholder{color:var(--np-input-placeholder)}
.input:hover,.textarea:hover,.select select:hover,input:hover,textarea:hover,select:hover{border-color:#cbd5e1}
.input:focus,.textarea:focus,.select select:focus,input:focus,textarea:focus,select:focus{outline:0;border-color:var(--np-input-focus);box-shadow:0 0 0 3px rgba(29,78,216,.15)}
input[type="checkbox"],input[type="radio"]{width:auto;height:auto;margin-right:.5rem;vertical-align:middle}
.np-check{display:flex;align-items:center;gap:.5rem}
.button,button,input[type="submit"]{border-radius:12px;border:1px solid transparent;font-weight:600;padding:.65rem 1rem;line-height:1.2;cursor:pointer;background:#f8fafc;color:var(--np-text)}
.button.is-link,button.is-link,input[type="submit"].is-link{background:var(--np-accent);color:var(--np-accent-contrast)}
.button.is-light{background:#eff6ff;color:#1e40af}
.button.is-outlined{background:transparent;border-color:var(--np-accent);color:var(--np-accent)}
.button.is-outlined:hover{background:#eff6ff}
.button:disabled,[disabled]{opacity:.6;cursor:not-allowed}
.comment-form p{margin:0}
.comment-form>p{margin-bottom:1rem}
.comment-form-cookies-consent{display:flex;align-items:center;gap:.5rem}
.comment-form .submit{margin-top:.25rem}
a:focus-visible,button:focus-visible,.button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--np-accent);outline-offset:2px}

/* Utilitai: balta spalva tik tamsiuose konteineriuose */
body :is(.has-text-white,.has-text-light,.has-white-color,.has-text-white-bis,.has-text-white-ter){color:var(--np-text) !important}
.has-text-grey,.has-text-grey-dark,.has-text-grey-light{color:var(--np-muted) !important}
.title .has-text-grey,.subtitle .has-text-grey{color:var(--np-muted) !important}
:is(.is-dark,.has-background-dark,.has-background-black,.has-background-grey-darker,.has-background-link-dark,.hero.is-dark,.notification.is-dark,.navbar.is-dark){color:#ffffff !important;background-color:inherit}
:is(.is-dark,.has-background-dark,.has-background-black,.has-background-grey-darker,.has-background-link-dark,.hero.is-dark,.notification.is-dark,.navbar.is-dark) :is(p,li,a,span,small,label,.title,.subtitle,h1,h2,h3,h4,h5,h6,strong,b,.has-text-white,.has-text-light,.has-white-color){color:#ffffff !important}

/* Meniu/porastė */
.navbar .navbar-item,.navbar .navbar-link{color:var(--np-text) !important}
footer.section .np-footer-link{color:var(--np-text);opacity:.85}
footer.section .np-footer-link:hover{opacity:1;text-decoration:underline;text-underline-offset:2px}

/* Placeholder kontrastas */
::placeholder{color:#6b7280 !important}

/* Smulkmenos ir FOUC apsauga */
.pagination .pagination-previous a,.pagination .pagination-next a{border-radius:10px}
.surface{background:var(--np-surface);border:1px solid var(--np-border);border-radius:16px}
.muted{color:var(--np-muted)}
html,body{background:var(--np-bg)}
.card,.box,.notification,.hero,footer.section,.navbar,.np-header{background:var(--np-surface)}


/* ===== WP Heading – įskaitomas pagal nutylėjimą ===== */
.wp-block-heading,
.wp-block-heading a {
  color: var(--np-text) !important;     /* tamsus, skaitomas */
}

/* Tamsiuose konteineriuose – baltas */
:is(.is-dark, .has-background-dark, .has-background-black,
    .has-background-grey-darker, .has-background-link-dark,
    .hero.is-dark, .notification.is-dark, .navbar.is-dark)
  .wp-block-heading {
  color: #ffffff !important;
}

/* Pasirinktinis „šviesiai pilkas“ variantas, kai tikrai reikia */
.wp-block-heading.heading--muted { 
  color: #475569 !important;            /* šviesesnis pilkas, bet vis dar įskaitomas */
}


/* ===== Kortelių dekoratyvinė vektorika (melsva) ===== */
.np-card-art{
  position: relative;
  aspect-ratio: 6 / 2;            /* stabilus aukštis – be CLS */
  border-radius: 14px;
  overflow: hidden;
  background: #eef5ff;
  margin-bottom: 0.9rem;          /* tarpas nuo teksto */
}
.np-card-art__svg{ width:100%; height:100%; display:block; }

/* Melsvos bangos */
.np-card-art__shape{
  fill: var(--np-accent);
  opacity: .10;
  transform: translateX(0) translateY(0);
  animation: np-drift 9s ease-in-out infinite;
  will-change: transform;          /* GPU sluoksnis animacijai */
}
.np-card-art__shape--2{
  opacity: .14;
  animation-duration: 13s;         /* skirtingi ritmai – gyvumas */
}

@keyframes np-drift {
  0%   { transform: translateX(0) translateY(0); }
  50%  { transform: translateX(2%) translateY(-2%); }
  100% { transform: translateX(0) translateY(0); }
}

/* Pagarba „prefers-reduced-motion“ – išjungiame judesį */
@media (prefers-reduced-motion: reduce){
  .np-card-art__shape{ animation: none !important; }
}

/* ===== HERO: melsvos bangos fone (subtili animacija, be įtakos tekstui) ===== */
.np-hero{ position:relative; isolation:isolate; } /* turinys bus virš pseudo-fono */
.np-hero .hero-body,
.np-hero .wp-block-cover__inner-container{ position:relative; z-index:1; }

/* vektorinis fonas – tokios pat spalvos/forma kaip kortelėse */
.np-hero::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-color:#eef5ff;             /* švelni bazė */
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 480' preserveAspectRatio='none'>\
<defs><linearGradient id='g' x1='0' y1='0' x2='0' y2='1'>\
<stop offset='0%' stop-color='%23eaf2ff'/><stop offset='100%' stop-color='%23f6faff'/>\
</linearGradient></defs>\
<rect width='1440' height='480' fill='url(%23g)'/>\
<path d='M0,320 C260,260 520,420 780,320 C975,270 1150,375 1440,315 L1440,480 L0,480 Z' fill='%231d4ed8' fill-opacity='.10'/>\
<path d='M0,360 C300,300 600,480 960,360 C1120,320 1280,390 1440,365 L1440,480 L0,480 Z' fill='%231d4ed8' fill-opacity='.14'/>\
</svg>");
  background-size:cover; background-position:center; mix-blend-mode:normal;
  transform:translateZ(0);
  animation: np-hero-sway 18s ease-in-out infinite;
  will-change: transform;               /* našu: animuojam transform'ą */
}

/* subtili „kvėpuojanti“ animacija */
@keyframes np-hero-sway{
  0%{transform:translateY(0)} 50%{transform:translateY(-1.5%)} 100%{transform:translateY(0)}
}

/* prieinamumas: jei vartotojas prašo mažiau judesio – stabdom animaciją */
@media (prefers-reduced-motion: reduce){
  .np-hero::before{ animation:none !important; }
}


/* ===== HERO fonai: vector / image / none ===== */
.np-hero{ position:relative; isolation:isolate; }
.np-hero .hero-body{ position:relative; z-index:1; }

/* Vektorinė melsva animacija – tik kai bg--vector */
.np-hero.bg--vector::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-color:#eef5ff;
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 480' preserveAspectRatio='none'>\
<defs><linearGradient id='g' x1='0' y1='0' x2='0' y2='1'>\
<stop offset='0%' stop-color='%23eaf2ff'/><stop offset='100%' stop-color='%23f6faff'/>\
</linearGradient></defs>\
<rect width='1440' height='480' fill='url(%23g)'/>\
<path d='M0,320 C260,260 520,420 780,320 C975,270 1150,375 1440,315 L1440,480 L0,480 Z' fill='%231d4ed8' fill-opacity='.10'/>\
<path d='M0,360 C300,300 600,480 960,360 C1120,320 1280,390 1440,365 L1440,480 L0,480 Z' fill='%231d4ed8' fill-opacity='.14'/>\
</svg>");
  background-size:cover; background-position:center;
  transform:translateZ(0);
  animation: np-hero-sway 18s ease-in-out infinite;
  will-change: transform;
}
@keyframes np-hero-sway{ 0%{transform:translateY(0)} 50%{transform:translateY(-1.5%)} 100%{transform:translateY(0)} }
@media (prefers-reduced-motion: reduce){ .np-hero.bg--vector::before{ animation:none !important; } }

/* Paveikslas – kai bg--image */
.np-hero.bg--image .np-hero__bg{
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center;
  filter:none; /* be blend'ų – kad „nepajuoduotų“ */
}
/* Be fono – kai bg--none */
.np-hero.bg--none::before{ content:none !important; }


/* ===== HERO: kortelės „chrome“ (radius + šešėlis) ===== */
.np-hero{
  position: relative;
  background: var(--np-surface);
  border: 1px solid var(--np-border);
  border-radius: var(--np-radius);
  box-shadow: var(--np-shadow-sm);   /* toks pat kaip .notification/.box */
  overflow: hidden;                  /* kad fonas neperlietų radius'ų */
}

/* Vektorinės fono animacijos ir paveikslo kraštai paveldi radius'ą */
.np-hero.bg--vector::before{ border-radius: inherit; }
.np-hero.bg--image .np-hero__bg{ border-radius: inherit; }

/* Saugiai: fono sluoksnis nekliudo paspaudimų */
.np-hero.bg--vector::before,
.np-hero.bg--image .np-hero__bg{ pointer-events: none; }
