/*
Theme Name: SKY – Suomen Kannabisyhdistys
Theme URI: https://sky.org
Description: Alateema Twenty Twenty-Five -teemalle. Moderni, tumma ja rohkea ilme SKY:n sivustolle.
Author: Suomen Kannabisyhdistys ry
Author URI: https://sky.org
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sky-theme
*/

/* ============================================================
   SKY – GLOBAALIT TYYLIT
   Tumma pohjaväri | Lime-aksentti | Inter-typografia
   ============================================================ */

/* Google Fonts – Inter */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ---- Globaalit muuttujat ---- */
:root {
	--sky-green-dark:   #1B5E20;
	--sky-green-mid:    #2E7D32;
	--sky-lime:         #76C442;
	--sky-lime-hover:   #8ED455;
	--sky-black:        #111111;
	--sky-dark:         #1A1A1A;
	--sky-card:         #252525;
	--sky-border:       #333333;
	--sky-white:        #FFFFFF;
	--sky-muted:        #BBBBBB;
	--sky-font:         'Inter', 'Manrope', sans-serif;
}

/* ---- Pohja ---- */
body {
	background-color: var(--sky-black) !important;
	color: var(--sky-white) !important;
	font-family: var(--sky-font) !important;
}

/* ---- Linkit ---- */
a {
	color: var(--sky-lime);
	text-decoration: none;
}
a:hover {
	color: var(--sky-lime-hover);
	text-decoration: underline;
}

/* ============================================================
   HEADER / NAVIGAATIO
   ============================================================ */
.wp-block-template-part[data-wp-block-type="header"],
header.wp-block-template-part {
	background-color: rgba(17, 17, 17, 0.97) !important;
	border-bottom: 1px solid var(--sky-border);
	position: sticky;
	top: 0;
	z-index: 100;
	backdrop-filter: blur(8px);
}

/* Site title */
.wp-block-site-title a,
.wp-block-site-title {
	font-family: var(--sky-font) !important;
	font-weight: 800 !important;
	font-size: 1.4rem !important;
	letter-spacing: 0.05em;
	color: var(--sky-white) !important;
	text-transform: uppercase;
}

/* Navigaatiolinkit */
.wp-block-navigation a,
.wp-block-navigation .wp-block-navigation-item__content {
	color: var(--sky-white) !important;
	font-family: var(--sky-font) !important;
	font-weight: 500;
	font-size: 0.9rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	transition: color 0.2s;
}
.wp-block-navigation a:hover {
	color: var(--sky-lime) !important;
	text-decoration: none;
}

/* ============================================================
   HERO-OSIO (Cover-lohko)
   ============================================================ */
.wp-block-cover.sky-hero {
	min-height: 92vh !important;
}
.wp-block-cover.sky-hero .wp-block-cover__inner-container {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
}

/* ============================================================
   OTSIKOT
   ============================================================ */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: var(--sky-font) !important;
	color: var(--sky-white) !important;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
}
h1 { font-size: clamp(2.5rem, 6vw, 5rem); letter-spacing: -0.03em; }
h2 { font-size: clamp(1.8rem, 4vw, 3rem); }
h3 { font-size: clamp(1.2rem, 2.5vw, 1.75rem); font-weight: 700; }

/* Lime-yläotsikko (klass: sky-overtitle) */
.sky-overtitle {
	color: var(--sky-lime) !important;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* ============================================================
   NAPIT (BUTTONS)
   ============================================================ */
.wp-block-button__link,
.wp-element-button {
	font-family: var(--sky-font) !important;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border-radius: 4px !important;
	transition: all 0.2s ease;
	font-size: 0.85rem;
}

/* Päänappi – lime */
.wp-block-button.is-style-fill .wp-block-button__link,
.wp-block-button:not([class*="is-style"]) .wp-block-button__link {
	background-color: var(--sky-lime) !important;
	color: var(--sky-black) !important;
	border: 2px solid var(--sky-lime) !important;
	padding: 14px 32px !important;
}
.wp-block-button.is-style-fill .wp-block-button__link:hover,
.wp-block-button:not([class*="is-style"]) .wp-block-button__link:hover {
	background-color: var(--sky-lime-hover) !important;
	border-color: var(--sky-lime-hover) !important;
}

/* Ääriviivanapit – outline */
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent !important;
	color: var(--sky-white) !important;
	border: 2px solid var(--sky-white) !important;
	padding: 14px 32px !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--sky-white) !important;
	color: var(--sky-black) !important;
}

/* ============================================================
   KOLUMNI-KORTIT (Pilarit, palvelut)
   ============================================================ */
.wp-block-columns.sky-pillars .wp-block-column {
	background-color: var(--sky-card);
	border: 1px solid var(--sky-border);
	border-radius: 8px;
	padding: 2rem 1.75rem;
	transition: border-color 0.2s, transform 0.2s;
}
.wp-block-columns.sky-pillars .wp-block-column:hover {
	border-color: var(--sky-lime);
	transform: translateY(-4px);
}

/* Pilarin ikoni/numero */
.sky-pillar-icon {
	font-size: 2rem;
	margin-bottom: 0.75rem;
	display: block;
}

/* ============================================================
   CTA-PALKKI (Jäsenyys)
   ============================================================ */
.sky-cta-band {
	background: linear-gradient(135deg, var(--sky-green-dark) 0%, var(--sky-green-mid) 100%) !important;
	padding: clamp(3rem, 6vw, 5rem) 2rem !important;
	text-align: center;
}
.sky-cta-band h2 {
	color: var(--sky-white) !important;
}

/* ============================================================
   INFO-BANNERI (Lääkekannabis-nosto)
   ============================================================ */
.sky-info-banner {
	background-color: var(--sky-card);
	border-left: 4px solid var(--sky-lime);
	padding: 1.5rem 2rem;
	border-radius: 0 6px 6px 0;
}

/* ============================================================
   UUTISKORTIT (Query Loop)
   ============================================================ */
.wp-block-post-template .wp-block-post {
	background-color: var(--sky-card);
	border: 1px solid var(--sky-border);
	border-radius: 8px;
	overflow: hidden;
	transition: border-color 0.2s, transform 0.2s;
}
.wp-block-post-template .wp-block-post:hover {
	border-color: var(--sky-lime);
	transform: translateY(-3px);
}
.wp-block-post-title a {
	color: var(--sky-white) !important;
	font-weight: 700;
}
.wp-block-post-title a:hover {
	color: var(--sky-lime) !important;
	text-decoration: none;
}
.wp-block-post-date time,
.wp-block-post-excerpt p {
	color: var(--sky-muted) !important;
	font-size: 0.875rem;
}


/* Uutiskortin featured image – 16/9, täyttää kortin leveyden */
.wp-block-post-template .wp-block-post-featured-image {
	display: block;
	width: 100%;
	line-height: 0;
}
.wp-block-post-template .wp-block-post-featured-image a {
	display: block;
	width: 100%;
}
.wp-block-post-template .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	height: auto !important;
	max-height: none !important;
}
/* Piilotetaan tyhjä kuva-alue (ei featured imagea asetettu) */
.wp-block-post-template .wp-block-post-featured-image:not(:has(img)) {
	display: none;
}

/* ============================================================
   OSIOIDEN VAAKA-PADDINGT (sivun reunoista)
   alignfull-osiot peruuttavat root-paddingin – palautetaan
   sisällölle oma sivumarginaali
   ============================================================ */
.wp-block-group.alignfull,
.wp-block-cover.alignfull {
	padding-left:  clamp(1.25rem, 5vw, 4rem) !important;
	padding-right: clamp(1.25rem, 5vw, 4rem) !important;
}
/* Alignwide sisällä alignfull – ei tuplata paddingia */
.wp-block-group.alignfull .wp-block-group.alignwide,
.wp-block-group.alignfull .wp-block-columns.alignwide,
.wp-block-group.alignfull .wp-block-query.alignwide {
	padding-left: 0;
	padding-right: 0;
}
/* Hero-cover: ei lisäpaddingia reunoihin (sisältö on jo centered) */
.wp-block-cover.sky-hero {
	padding-left:  clamp(1.25rem, 5vw, 4rem) !important;
	padding-right: clamp(1.25rem, 5vw, 4rem) !important;
}

/* ============================================================
   FOOTER
   ============================================================ */
.wp-block-template-part[data-wp-block-type="footer"] {
	background-color: var(--sky-dark) !important;
	border-top: 1px solid var(--sky-border);
	color: var(--sky-muted);
}
.wp-block-template-part[data-wp-block-type="footer"] a {
	color: var(--sky-muted);
}
.wp-block-template-part[data-wp-block-type="footer"] a:hover {
	color: var(--sky-lime);
}


/* ============================================================
   SIVUOTSIKKO – EI NÄYTETÄ (template page.html/front-page.html ei sisällä post-title-blokkia)
   Varmuuden vuoksi piilotetaan myös CSS:llä jos joku template näyttäisi sen
   ============================================================ */
.wp-block-post-title.page-title-hidden,
.entry-header .wp-block-post-title {
	display: none !important;
}

/* ============================================================
   LOGO HEADERISSA
   ============================================================ */
.wp-block-site-logo img {
	max-height: 42px !important;
	width: auto !important;
}
.wp-block-site-logo {
	margin: 0 !important;
}

/* ============================================================
   APULUOKAT
   ============================================================ */
.sky-text-lime  { color: var(--sky-lime) !important; }
.sky-text-muted { color: var(--sky-muted) !important; }
.sky-bg-card    { background-color: var(--sky-card) !important; }
.sky-bg-dark    { background-color: var(--sky-dark) !important; }
.sky-section    { padding: clamp(4rem, 8vw, 7rem) 0; }
.sky-container  { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

.sky-tag {
	display: inline-block;
	background: var(--sky-green-dark);
	color: var(--sky-lime) !important;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: 3px;
}

/* Erotinviiva */
.sky-divider {
	border: none;
	border-top: 1px solid var(--sky-border);
	margin: 3rem 0;
}