/*
Theme Name: Ortega Textile
Theme URI: https://www.instagram.com/ortegatextile/
Author: Ortega Textile AG
Description: Schlankes, eigenständiges Theme für die Ortega Textile AG – nachgebaut nach der bisherigen Hostinger-Builder-Webseite. Schriften lokal eingebunden (keine Google-Server), Kontaktformular integriert, Inhalte vollständig im Block-Editor bearbeitbar.
Version: 1.0.0
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ortega-textile
*/

/* ---------- Schriften (lokal) ---------- */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/dm-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/dm-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/dm-sans-latin-600-normal.woff2) format("woff2")}

/* ---------- Grundwerte (Farben aus der Originalseite) ---------- */
:root{
	--ot-ink:#1d1e20;        /* Fliesstext, Navigation */
	--ot-black:#000000;
	--ot-navy:#0b1320;       /* Buttons, Markenname Footer */
	--ot-slate:#4a607a;      /* Copyright, dezente Texte */
	--ot-line:#e3e5e8;
	--ot-soft:#f6f6f4;
	--ot-white:#ffffff;
	--ot-serif:"Cormorant Garamond",Perpetua,Georgia,serif;
	--ot-sans:"DM Sans",Helvetica,Arial,sans-serif;
	--ot-max:1224px;
	--ot-gutter:clamp(16px,4vw,40px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ot-white);color:var(--ot-ink);font-family:var(--ot-serif);font-weight:500;font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ot-slate)}
h1,h2,h3,h4,h5,h6{font-family:var(--ot-serif);font-weight:500;line-height:1.15;color:var(--ot-black);margin:0 0 .6em}
h1{font-size:clamp(40px,6vw,64px)}
h2{font-size:clamp(34px,4.4vw,48px)}
h3{font-size:clamp(20px,2vw,22px)}
h4{font-size:20px}
p{margin:0 0 1.1em}
:focus-visible{outline:2px solid var(--ot-navy);outline-offset:3px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:8px;left:8px;z-index:100;background:#fff;padding:8px 14px;clip:auto;width:auto;height:auto}

.ot-container{max-width:var(--ot-max);margin:0 auto;padding:0 var(--ot-gutter)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--ot-white);border-bottom:1px solid transparent;transition:border-color .2s}
.site-header.is-scrolled{border-bottom-color:var(--ot-line)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:130px}
.is-scrolled .site-header__inner{min-height:90px}
.site-brand img,.site-brand .custom-logo{height:92px;width:auto;transition:height .2s}
.is-scrolled .site-brand img,.is-scrolled .site-brand .custom-logo{height:62px}
.site-brand__text{font-size:28px;text-decoration:none;color:var(--ot-navy)}
.main-nav{display:flex;align-items:center;gap:36px}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:32px}
.main-nav a{font-family:var(--ot-sans);font-weight:400;font-size:16px;text-decoration:none;color:var(--ot-ink);padding:6px 0;border-bottom:1px solid transparent}
.main-nav a:hover{color:var(--ot-ink);border-bottom-color:currentColor}
.main-nav .current-menu-item>a,.main-nav .current_page_item>a{border-bottom-color:currentColor}
.lang-switch{font-family:var(--ot-sans);font-size:14px;display:flex;gap:10px}
.lang-switch ul{gap:10px}
.lang-switch a{font-size:14px;text-transform:uppercase}
.lang-switch .current-lang a{border-bottom-color:currentColor}
.nav-toggle{display:none;background:none;border:0;padding:10px;cursor:pointer;color:var(--ot-ink)}
.nav-toggle span{display:block;width:26px;height:2px;background:currentColor;margin:6px 0;transition:transform .2s,opacity .2s}

@media (max-width:900px){
	.site-header__inner{min-height:88px}
	.site-brand img,.site-brand .custom-logo{height:62px}
	.nav-toggle{display:block}
	.main-nav{position:fixed;inset:88px 0 0 0;background:var(--ot-white);flex-direction:column;align-items:flex-start;padding:24px var(--ot-gutter);gap:24px;transform:translateX(100%);transition:transform .25s;overflow-y:auto}
	.main-nav ul{flex-direction:column;gap:18px}
	.main-nav a{font-size:22px}
	body.nav-open .main-nav{transform:none}
	body.nav-open{overflow:hidden}
	body.nav-open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
	body.nav-open .nav-toggle span:nth-child(2){opacity:0}
	body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
}

/* ---------- Hero (Beitragsbild der Seite) ---------- */
.hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:clamp(260px,40vw,440px);color:var(--ot-white);text-align:center;overflow:hidden;background:#555}
.hero--quote{min-height:clamp(420px,62vw,720px)}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:rgba(10,14,20,.38)}
.hero__content{position:relative;z-index:1;max-width:980px;padding:48px var(--ot-gutter)}
.hero__title{color:var(--ot-white);margin:0}
.hero__quote{font-size:clamp(22px,2.6vw,32px);line-height:1.4;margin:0 0 .5em}
.hero__cite{font-size:clamp(18px,1.8vw,24px);font-style:normal}

/* ---------- Seiteninhalt / Blöcke ---------- */
.site-main{padding:clamp(56px,8vw,110px) 0}
.page-content>*{max-width:var(--ot-max);margin-left:auto;margin-right:auto}
.page-content>*+*{margin-top:1.1em}
.page-content>.wp-block-heading{margin-top:clamp(56px,7vw,100px)}
.page-content>.wp-block-heading:first-child{margin-top:0}
.page-content>.alignfull{max-width:none}
.page-content>.is-narrow,.page-content>.has-text-align-center:not(.wp-block-heading){max-width:860px}
.page-content .wp-block-heading+.wp-block-columns{margin-top:32px}
.wp-block-columns{gap:clamp(24px,4vw,64px)}
.wp-block-column h3{font-size:22px;margin-top:1.4em}
.wp-block-column h3:first-child{margin-top:0}
.wp-block-list{padding-left:1.1em}
.wp-block-list li{margin-bottom:.35em}
.wp-block-image img{width:100%}
.lead{font-size:clamp(20px,2vw,24px);line-height:1.45}
.eyebrow{font-family:var(--ot-sans);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--ot-slate)}

/* Angebot: abwechselnde Bild-Text-Reihen */
.offer-row{margin-top:clamp(40px,6vw,80px)!important}
.offer-row h3{font-size:clamp(24px,2.4vw,30px)}

/* Galerie */
.wp-block-gallery.has-nested-images{gap:12px}
.wp-block-gallery.has-nested-images figure.wp-block-image img{aspect-ratio:1/1;object-fit:cover}
.gallery-2 figure.wp-block-image img{aspect-ratio:4/5!important}

/* Buttons */
.wp-block-button__link,.ot-button,button.ot-button{display:inline-block;font-family:var(--ot-sans);font-size:14px;font-weight:500;letter-spacing:.04em;background:var(--ot-navy);color:var(--ot-white);border:1px solid var(--ot-navy);border-radius:0;padding:14px 34px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.wp-block-button__link:hover,.ot-button:hover{background:var(--ot-white);color:var(--ot-navy)}
.is-style-outline .wp-block-button__link{background:transparent;color:var(--ot-navy)}
.is-style-outline .wp-block-button__link:hover{background:var(--ot-navy);color:var(--ot-white)}
.wp-block-buttons{margin-top:32px}

/* Stoff-Artikel (Kollektion) */
.fabric-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fabric-grid>*{margin:0!important}
.fabric-card{position:relative;overflow:hidden;background:#222;color:var(--ot-white);aspect-ratio:4/4.25}
.fabric-card .wp-block-image{margin:0;position:absolute;inset:0}
.fabric-card .wp-block-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.fabric-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,12,18,.78) 0%,rgba(8,12,18,.15) 45%,rgba(8,12,18,0) 70%);transition:background .3s;pointer-events:none}
.fabric-card h3{position:absolute;left:24px;right:24px;bottom:22px;z-index:2;margin:0;color:var(--ot-white);font-size:24px;transition:bottom .3s}
.fabric-card p{position:absolute;left:24px;right:24px;bottom:22px;z-index:2;margin:0;font-size:16px;line-height:1.45;opacity:0;transform:translateY(12px);transition:opacity .3s,transform .3s}
@media (hover:hover){
	.fabric-card:hover::after,.fabric-card:focus-within::after{background:rgba(8,12,18,.72)}
	.fabric-card:hover img{transform:scale(1.04)}
	.fabric-card:hover h3,.fabric-card:focus-within h3{bottom:auto;top:24px}
	.fabric-card:hover p,.fabric-card:focus-within p{opacity:1;transform:none}
}
@media (hover:none),(max-width:700px){
	.fabric-card{aspect-ratio:auto;background:var(--ot-navy)}
	.fabric-card .wp-block-image{position:relative}
	.fabric-card .wp-block-image img{aspect-ratio:1/1}
	.fabric-card::after{display:none}
	.fabric-card h3,.fabric-card p{position:static;opacity:1;transform:none;padding:0 20px}
	.fabric-card h3{padding-top:18px;margin-bottom:8px}
	.fabric-card p{padding-bottom:22px}
}
@media (max-width:900px){.fabric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.fabric-grid{grid-template-columns:1fr}}

/* Karte */
.map-embed iframe{width:100%;height:420px;border:0;display:block;filter:grayscale(.35)}

/* ---------- Kontaktformular ---------- */
.ot-form{display:grid;gap:18px;max-width:560px}
.ot-form label{display:block;font-size:16px;margin-bottom:6px;color:var(--ot-black)}
.ot-form input[type=text],.ot-form input[type=email],.ot-form textarea{width:100%;font:inherit;font-size:16px;color:var(--ot-ink);background:var(--ot-white);border:1px solid #b9bec5;border-radius:0;padding:12px 14px}
.ot-form input:focus,.ot-form textarea:focus{outline:none;border-color:var(--ot-navy);box-shadow:0 0 0 1px var(--ot-navy)}
.ot-form textarea{min-height:150px;resize:vertical}
.ot-form .ot-hp{position:absolute!important;left:-9999px}
.ot-form__note{font-size:14px;color:var(--ot-slate)}
.ot-notice{padding:14px 18px;border-left:3px solid var(--ot-navy);background:var(--ot-soft);margin-bottom:20px}
.ot-notice--error{border-left-color:#a33}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--ot-line);padding:clamp(48px,6vw,80px) 0 40px;font-size:16px}
.site-footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.site-footer h2{font-size:28px;color:var(--ot-navy);margin-bottom:18px}
.site-footer h3{font-size:20px;margin-bottom:10px}
.site-footer p{margin:0 0 .4em;color:var(--ot-ink)}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-social{display:inline-flex;margin:4px 0 18px;color:var(--ot-black)}
.footer-social svg{width:30px;height:30px}
.footer-copy{font-size:14px;font-weight:300;color:var(--ot-slate)!important}
.footer-legal{margin-top:14px!important}
.footer-legal a{text-decoration:underline;font-size:16px}
@media (max-width:760px){.site-footer__grid{grid-template-columns:1fr}}

/* ---------- WordPress-Kernklassen ---------- */
.alignleft{float:left;margin:0 1.5em 1em 0}
.alignright{float:right;margin:0 0 1em 1.5em}
.aligncenter{margin-left:auto;margin-right:auto}
.has-text-align-center{text-align:center}
.wp-caption-text,.wp-element-caption{font-size:14px;color:var(--ot-slate)}