/* === Vaidilutės namai – Global Styles === */

/* FONTAI */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&display=swap');

/* === CSS Variables === */
:root{
  --bg: #F6F8FB;
  --text: #01172C;
  --muted: #5f6470;
  --primary: #1a2332;           /* tamsiai mėlyna mygtukui */
  --primary-contrast: #ffffff;
  --border: #e8eaef;

  --header-h: 88px;
  --container: 1240px;
  --radius: 14px;
  --radius-pill: 999px;
  --shadow: 0 12px 28px rgba(0,0,0,.10);
  --container-pad: 24px;
}

/* === Reset & Base === */
*{ box-sizing: border-box; }
html,body{ height:100%; }
html{ scroll-behavior:smooth;}
/* Prevent iOS 100vw scrollbar issue */
body{ overflow-x:hidden; }
body{
  margin:0;
  font-family: 'Syne', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.5;
}

/* === Accessibility === */
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* === Layout Helpers === */
.container{
  max-width: var(--container);
  margin-inline:auto;
  padding-inline: var(--container-pad);
}

/* === Buttons === */
.pill{ border-radius: var(--radius-pill); }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; cursor:pointer; border:1px solid transparent; padding:14px 28px; font-weight:600; font-size: 15px; transition:.15s ease; }
.btn:active{ transform: translateY(1px); }
.btn-dark{ background: var(--primary); color: var(--primary-contrast); }
.btn-dark:hover{ background: #0f1822; }

/* === Footer (legacy) === */
.site-footer{
  border-top:1px solid var(--border);
  padding: 28px 0; margin-top: 60px;
  background: #fafafa; color: #111;
}
.footer-inner{ display:flex; gap:12px; justify-content:space-between; align-items:center; flex-wrap:wrap; }
.back-to-top{ text-decoration:none; color:var(--text); opacity:.75; }
.back-to-top:hover{ opacity:1; }

/* === Animation utilities (used by animations.js) === */
.a-init{ opacity:0; transform: translateY(16px); }
.a-show{ opacity:1; transform: none; transition: opacity .6s ease, transform .6s ease; }
.a-slide-up{ opacity:0; transform: translateY(24px); }
.a-slide-left{ opacity:0; transform: translateX(24px); }
.a-slide-right{ opacity:0; transform: translateX(-24px); }

/* visible state added by JS */
.is-visible{ opacity:1 !important; transform: none !important; transition: opacity .6s ease, transform .6s ease; }