/*
Theme Name: ZieFab — Astra enfant
Description: Boutique artisanale ZieFab. Créé par Codex pour Astra et WooCommerce.
Author: Codex
Version: 1.1.0
Template: astra
Text Domain: ziefab
*/
:root{--zf-blue:#073b68;--zf-ink:#132b3c;--zf-cream:#faf8f2;--zf-gold:#b98b38;--zf-line:#dedfd9}
body{color:var(--zf-ink);background:var(--zf-cream)}
a{color:var(--zf-blue)}
.zf-wrap{max-width:1200px;margin:auto;padding:0 28px}
.zf-header{background:#fff;border-bottom:1px solid var(--zf-line)}
.zf-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 0}
.zf-logo{display:block;width:130px;height:100px;object-fit:contain}
.zf-links{display:flex;gap:26px;align-items:center;flex-wrap:wrap}.zf-links a{text-decoration:none;font-weight:600}
.zf-hero{padding:80px 0;display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:50px}
.zf-eyebrow{color:#795718;text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:700}
.zf-hero h1{font-size:clamp(38px,5.2vw,68px);line-height:1.08;letter-spacing:-.04em;color:var(--zf-blue);margin:18px 0 24px}
.zf-lead{font-size:19px;line-height:1.7;max-width:650px}
.zf-button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{display:inline-block;background:var(--zf-blue);color:#fff;border-radius:8px;padding:14px 23px;text-decoration:none;font-weight:600;border:0}
.zf-button:hover,.zf-button:focus{background:#0c548c;color:#fff}.zf-button.secondary{background:transparent;color:var(--zf-blue);border:1px solid var(--zf-blue)}
.zf-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.zf-art{background:#e9f0f4;border-radius:150px 150px 20px 20px;padding:45px 25px;text-align:center;border-bottom:4px solid var(--zf-gold)}.zf-art img{width:100%;height:auto}.zf-art p{margin-top:24px;color:var(--zf-blue);font-size:14px}
.zf-section{padding:60px 0}.zf-section h2{font-size:36px;color:var(--zf-blue);letter-spacing:-.02em;margin-bottom:16px}.zf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.zf-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--zf-line);border-radius:14px;padding:28px;color:var(--zf-ink);text-decoration:none;transition:transform .2s}.zf-card:hover{transform:translateY(-4px);border-color:var(--zf-blue)}.zf-card h3{font-size:23px;color:var(--zf-blue);margin:14px 0}.zf-card p{line-height:1.65;margin-bottom:18px}.zf-card span:last-child{margin-top:auto;font-weight:600;color:var(--zf-blue)}.zf-number{font-size:13px;color:#795718;letter-spacing:.12em}
.zf-band{background:var(--zf-blue);color:#fff}.zf-band h2{color:#fff}.zf-band .zf-eyebrow{color:#e8c989}.zf-band .zf-button{background:#fff;color:var(--zf-blue)}
.zf-about{display:grid;grid-template-columns:1fr 1.5fr;gap:50px;align-items:start}.zf-footer{background:#fff;border-top:1px solid var(--zf-line);padding:32px 0}.zf-footer p{font-size:14px;margin:8px 0}.zf-contact{max-width:800px;padding:70px 28px;margin:auto}.zf-contact h1{color:var(--zf-blue);font-size:48px}.zf-contact section{background:white;padding:26px;border:1px solid var(--zf-line);border-radius:12px;margin:20px 0}
.woocommerce ul.products li.product{background:#fff;padding:16px;border:1px solid var(--zf-line);border-radius:12px}.woocommerce span.onsale{background:var(--zf-blue)}.woocommerce div.product p.price,.woocommerce ul.products li.product .price{color:var(--zf-blue)}
a:focus-visible,button:focus-visible{outline:3px solid var(--zf-gold);outline-offset:4px}
@media(max-width:800px){.zf-hero{grid-template-columns:1fr;padding:45px 0;gap:30px}.zf-art{max-width:360px;margin:auto}.zf-grid{grid-template-columns:repeat(2,1fr)}.zf-about{grid-template-columns:1fr;gap:15px}.zf-links{gap:14px}.zf-nav{align-items:flex-start}.zf-logo{width:90px;height:75px}.zf-section{padding:40px 0}}
@media(max-width:500px){.zf-grid{grid-template-columns:1fr}.zf-wrap{padding:0 20px}.zf-links{font-size:14px;max-width:220px}.zf-section h2{font-size:30px}.zf-contact h1{font-size:36px}}

/* A colourful atelier palette with a fuller brand header. */
:root{--zf-blue:#123e61;--zf-ink:#183d4b;--zf-cream:#fffaf3;--zf-line:#cadfdd;--zf-teal:#167b7e;--zf-peach:#c1e4e8}
body{background:var(--zf-cream)}
.zf-header{background:#e1f2ee;border-top:5px solid var(--zf-teal);border-bottom:0}
.zf-brand{display:flex;align-items:center;gap:40px;padding-top:22px;padding-bottom:22px}
.zf-brand .zf-logo{width:180px;height:148px;max-width:none}
.zf-signature{flex:1}.zf-signature p{font-family:Georgia,serif;font-size:clamp(23px,2.6vw,34px);line-height:1.22;color:var(--zf-blue);margin:0 0 12px}.zf-signature em{color:#176c6e;font-weight:400}.zf-signature span{font-size:12px;letter-spacing:.09em;text-transform:uppercase;font-weight:600}
.zf-header-cta{background:var(--zf-peach);color:#293d48;padding:13px 20px;border-radius:30px;font-weight:700;text-decoration:none;white-space:nowrap}
.zf-menu{background:var(--zf-blue)}.zf-nav{justify-content:center;padding-top:15px;padding-bottom:15px}.zf-links{justify-content:center;gap:42px}.zf-links a{color:white}.zf-links a:hover{color:#c1e4e8}
.zf-collections-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:15px 32px;padding-top:13px;padding-bottom:13px}.zf-collections-nav a{font-size:13px;color:#215c62;text-decoration:none;font-weight:600}
.home #contenu{background:linear-gradient(125deg,#d5eeea 0%,#ecf6ee 46%,#e3f0f8 100%)}
.zf-hero{padding-top:60px;padding-bottom:60px}.zf-hero h1{font-family:Georgia,serif;font-weight:400;letter-spacing:-.035em}.zf-eyebrow{color:#17696d}.zf-art{background:#d4e9f5;border-radius:48% 48% 22px 22px;border-bottom:5px solid #268a8c;box-shadow:16px 16px 0 #c3e5df;padding:32px 24px}.zf-art p{font-weight:600}
.zf-section h2{font-family:Georgia,serif;font-weight:400}.zf-card{border:0;border-top:5px solid #168084;box-shadow:0 6px 18px #123e610b}.zf-card:nth-child(6n+1){background:#d0e9e1;border-color:#267d66}.zf-card:nth-child(6n+2){background:#cce8ee;border-color:#287c90}.zf-card:nth-child(6n+3){background:#d7e7f4;border-color:#386e9c}.zf-card:nth-child(6n+4){background:#ece0f1;border-color:#8b62a0}.zf-card:nth-child(6n+5){background:#eee0c5;border-color:#8d6c36}.zf-card:nth-child(6n){background:#c5e7e8;border-color:#14777c}.zf-number{color:#355b63}.zf-card h3{font-family:Georgia,serif}
.zf-button{background:#146d72;border-radius:28px}.zf-button:hover{background:#104d54}.zf-button.secondary{background:#fff8ec;border-color:#176d72;color:#164e57}
.zf-band{background:#176d72}.zf-band .zf-eyebrow{color:#d7efed}.zf-band .zf-button{background:#c1e4e8;color:#233d47}.zf-about{background:#fff6e8}.zf-footer{background:#dceee9;border-top:4px solid #167b7e}
.zf-contact section:nth-of-type(1){background:#e0f1eb;border-top:5px solid #167b7e}.zf-contact section:nth-of-type(2){background:#dfedf7;border-top:5px solid #386e9c}.zf-contact h1{font-family:Georgia,serif;font-weight:400}
@media(max-width:800px){.zf-brand{gap:22px;flex-wrap:wrap}.zf-brand .zf-logo{width:130px;height:107px}.zf-signature p{font-size:25px}.zf-header-cta{margin-left:auto}.zf-links{max-width:none;gap:30px}.zf-art{box-shadow:10px 10px 0 #c3e5df}.zf-nav{align-items:center}}
@media(max-width:500px){.zf-brand{gap:16px;padding-top:18px;padding-bottom:18px}.zf-brand .zf-logo{width:100px;height:82px}.zf-signature p{font-size:20px}.zf-signature span{font-size:10px;letter-spacing:.02em}.zf-header-cta{font-size:12px;padding:9px 16px;margin-left:116px}.zf-links{gap:25px}.zf-collections-nav{gap:9px 18px}.zf-hero{padding-top:35px}}

.zf-about{padding-left:28px;padding-right:28px}

.zf-art{background:transparent;border:0;box-shadow:none;border-radius:0}

.zf-header{background:#fff}

/* Subtle gold accents echo the logo without changing the palette. */
.zf-header{border-top-color:var(--zf-gold)}
.zf-menu{border-bottom:2px solid var(--zf-gold)}
.zf-header-cta{border:1px solid var(--zf-gold)}
.zf-hero h1:after{content:"";display:block;width:76px;height:3px;background:var(--zf-gold);margin-top:25px}
.zf-hero .zf-actions .zf-button:not(.secondary){background:var(--zf-blue);box-shadow:inset 0 0 0 1px var(--zf-gold)}
.zf-hero .zf-actions .zf-button:not(.secondary):hover{background:#0c2f4c}
.zf-button.secondary{border-color:var(--zf-gold)}
.zf-card{box-shadow:0 6px 18px #123e610b,inset 0 -2px 0 var(--zf-gold)}
.zf-footer{border-top-color:var(--zf-gold)}

.zf-hero-banner{background:#e1f2ee url(https://ziefab.ca/wp-content/uploads/2026/10/ziefab-banniere-atelier.png) center center/cover no-repeat}
.zf-hero-banner .zf-hero{display:flex;min-height:620px;padding:65px 0;gap:0}
.zf-hero-banner .zf-hero>div{width:58%;max-width:690px}
.zf-hero-banner .zf-hero h1{font-size:clamp(36px,4.5vw,64px)}
.zf-hero-banner .zf-lead{font-size:18px;max-width:570px}
@media(max-width:800px){.zf-hero-banner{background-position:65% center}.zf-hero-banner .zf-hero{min-height:600px;padding:40px 0}.zf-hero-banner .zf-hero>div{width:70%;background:#e9f6edeb;padding:24px;border-radius:12px}.zf-hero-banner .zf-lead{font-size:16px}}
@media(max-width:500px){.zf-hero-banner{background-size:auto 390px;background-position:center bottom;padding-bottom:300px;background-color:#e8f5ed}.zf-hero-banner .zf-hero{min-height:0;padding:30px 0}.zf-hero-banner .zf-hero>div{width:100%;padding:0;background:transparent}.zf-hero-banner .zf-hero h1{font-size:38px}}

/* More visible gold framing for collections and section transitions. */
.zf-hero-banner{border-bottom:3px solid var(--zf-gold)}
.zf-section[aria-labelledby=collections]{position:relative}
#collections:after{content:"";display:block;width:110px;height:3px;background:var(--zf-gold);margin-top:18px}
.zf-grid .zf-card{border:1px solid var(--zf-gold);border-top:1px solid var(--zf-gold);box-shadow:0 5px 16px #79602212,inset 0 -2px 0 var(--zf-gold)}
.zf-grid .zf-number{color:#795718;font-weight:700}
.zf-band{border-top:3px solid var(--zf-gold);border-bottom:3px solid var(--zf-gold)}
.zf-about{border-bottom:1px solid var(--zf-gold)}

/* An atelier-inspired, softly asymmetric invitation button. */
.zf-header-cta{font-size:17px;padding:18px 27px;border:2px solid var(--zf-gold);border-radius:35% 65% 32% 68% / 62% 40% 60% 38%;box-shadow:4px 5px 0 #b98b3829;transition:transform .2s,box-shadow .2s;line-height:1.4}
.zf-header-cta:hover{color:var(--zf-blue);transform:translateY(-2px);box-shadow:5px 7px 0 #b98b3838}
@media(max-width:800px){.zf-header-cta{font-size:15px;padding:15px 22px}}
@media(max-width:500px){.zf-header-cta{font-size:13px;padding:13px 18px}}
@media(prefers-reduced-motion:reduce){.zf-header-cta{transition:none}.zf-header-cta:hover{transform:none}}

.zf-header-cta{position:relative;isolation:isolate;background:transparent;border:0;border-radius:0;box-shadow:none;padding:22px 32px;white-space:nowrap}
.zf-header-cta:before,.zf-header-cta:after{content:"";position:absolute;inset:3px 0;z-index:-1;pointer-events:none;clip-path:polygon(3% 18%,12% 12%,10% 7%,29% 10%,42% 4%,57% 8%,74% 3%,90% 9%,97% 7%,94% 19%,100% 23%,97% 37%,99% 46%,95% 60%,98% 70%,91% 75%,94% 86%,78% 83%,65% 94%,47% 88%,32% 94%,17% 87%,5% 91%,8% 78%,0 74%,4% 60%,1% 46%,5% 35%,0 28%)}
.zf-header-cta:before{background:var(--zf-gold);transform:translate(2px,4px) rotate(-1deg)}
.zf-header-cta:after{background:linear-gradient(178deg,#b0dadc 0%,#c1e4e8 48%,#acd6d9 100%)}
.zf-header-cta:hover{box-shadow:none}
@media(max-width:800px){.zf-header-cta{padding:19px 28px}}
@media(max-width:500px){.zf-header-cta{padding:17px 24px}}

/* Oval gold invitation with navigation-blue outline. */
.zf-header-cta{background:var(--zf-gold);color:var(--zf-blue);border:2px solid var(--zf-blue);border-radius:999px;box-shadow:none;padding:18px 27px}
.zf-header-cta:before,.zf-header-cta:after{content:none}
.zf-header-cta:hover{background:#c99d4c;color:var(--zf-blue);box-shadow:none}
@media(max-width:800px){.zf-header-cta{padding:15px 22px}}
@media(max-width:500px){.zf-header-cta{padding:13px 18px}}

/* Soft luminous gold inspired by the logo. */
.zf-header-cta{background:linear-gradient(125deg,#dfb455 0%,#f3d887 27%,#fff1bd 48%,#edca70 72%,#deb054 100%)}
.zf-header-cta:hover{background:linear-gradient(125deg,#e6bd64 0%,#f7df98 27%,#fff5cf 48%,#f2d382 72%,#e6b961 100%)}
