/*
Theme Name: Pokama Hugo Picard
Template: pokama-lite
Description: Thème enfant de Pokama Lite aux couleurs de la charte Hugo Picard / Gin Kmitsune (fond encre, Schibsted Grotesk, accent vermillon).
Version: 1.0.4
Text Domain: pokama-hugopicard
*/
:root{
  --bg:#0f1213;--bg2:#151a1c;--bg3:#1b2124;--line:#283033;--line2:#353e42;
  --text:#ecebe6;--muted:#9ba3a6;--accent:#e0523a;--accent-hi:#ea6a53;
  --sans:"Schibsted Grotesk",ui-sans-serif,system-ui,sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --r-sm:3px;--r:6px;--r-lg:10px;
  color-scheme:dark
}
html,body,#page,.site,.site-content,.content-area,.site-main,article,.site-header,.site-footer,.featured-area,.widget,.post,.page,.sidebar,#secondary{background:var(--bg)!important;color:var(--text)}
body,button,input,select,textarea,p,li,td,th,span,div,a,h1,h2,h3,h4,h5,h6,.site-title,.site-description,.entry-title,.widget-title{font-family:var(--sans)!important}
body{font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;caret-color:var(--accent)}
::selection{background:var(--accent);color:var(--bg)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-sm)}
p,li,.entry-content,.entry-summary{color:var(--muted);font-size:17px!important;line-height:1.65!important}
.entry-content p{max-width:42em}
strong,b{color:var(--text);font-weight:600}
h1,h2,h3,h4,h5,h6,.entry-title,.entry-title a{color:var(--text)!important;font-weight:600;letter-spacing:-.025em;line-height:1.08;text-wrap:balance;text-transform:none}
.entry-content h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin:2.2em 0 .55em}
.entry-content h3{font-size:1.3rem;margin:1.8em 0 .4em}
.entry-content h2 em,.entry-title em{font-style:italic;font-weight:500;color:var(--accent)!important}
a{color:var(--text);text-decoration-color:var(--line2);text-underline-offset:.2em;transition:color 150ms ease,text-decoration-color 150ms ease}
.entry-content a{color:var(--accent);text-decoration:underline;text-decoration-color:currentColor}
@media (hover:hover) and (pointer:fine){a:hover{color:var(--accent)}}
img{border-radius:var(--r)}

/* En-tête */
.site-header,#main-nav{border:0!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important}
#primary-menu a,.main-navigation a{color:var(--muted)!important;font-size:.92rem!important;font-weight:500;letter-spacing:0!important;text-transform:none!important}
@media (hover:hover) and (pointer:fine){#primary-menu a:hover{color:var(--text)!important}}
.main-navigation ul ul{background:var(--bg2)!important;border:1px solid var(--line)!important}
.menu-toggle .m_menu_icon{background:var(--text)!important}
.site-branding{padding:72px 0 48px!important;text-align:left;max-width:1200px;margin:0 auto;padding-left:clamp(20px,4vw,40px)!important;padding-right:clamp(20px,4vw,40px)!important}
.site-title,.site-title a{font-size:clamp(2.2rem,4.9vw,4.5rem)!important;font-weight:700!important;letter-spacing:-.035em!important;line-height:1!important;text-transform:none!important;color:var(--text)!important}
.site-description{display:none!important}

/* Bandeau des derniers articles sous l'en-tête : masqué (titres de ramen automatiques) */
.featured-area,#featured-bar{display:none!important}

/* Contenu */
.container{max-width:1200px}
.entry-header{border:0!important}
.entry-content img{height:auto}
.entry-content ul{padding-left:1.2em}
.entry-content ul li::marker{color:var(--accent)}
.entry-content hr,.site-content hr{border:0;border-top:1px solid var(--line)}
blockquote{border-left:0!important;padding:0!important;color:var(--text);font-size:1.25rem;font-weight:500}
.entry-meta,.entry-meta a,.post-date,.cat-links a,.byline{color:var(--muted)!important;text-transform:none!important;letter-spacing:0!important;font-size:.85rem!important}
.cat-links a{color:var(--accent)!important}

/* Titres d'articles */
.entry-title,.entry-title a{font-size:1.3rem!important;text-transform:none!important;letter-spacing:-.015em!important}
.single .entry-title,.page:not(.home) .entry-title{font-size:clamp(2rem,4vw,3.4rem)!important;letter-spacing:-.03em!important;line-height:1.05!important}
.page-title,.archive-title,.page-header h1{font-size:1rem!important;text-transform:none!important;letter-spacing:0!important;border:0!important;color:var(--accent)!important;font-weight:600!important;text-align:left!important;padding:0!important}
.page-header,.archive-header{border:0!important;background:none!important}

/* Accueil : bandeau photo d'ouverture masqué (contient une photo de ramen) */
.home .entry-content img[src*="Cuisine-asiatique"]{display:none!important}

/* Accueil : galerie des créations (grille asymétrique) */
.gk-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;aspect-ratio:16/10;margin:1.2em 0 .5em}
.gk-grid figure{margin:0;overflow:hidden;border-radius:var(--r)}
.gk-grid img{width:100%!important;height:100%!important;object-fit:cover;border-radius:0;display:block;transition:transform 600ms var(--ease-out)}
.gk-grid figure:nth-child(1){grid-row:1/3}
.gk-grid figure:nth-child(2){grid-column:2/4}
@media (hover:hover) and (pointer:fine){.gk-grid figure:hover img{transform:scale(1.03)}}
@media(max-width:700px){.gk-grid{grid-template-columns:1fr 1fr;grid-template-rows:none;aspect-ratio:auto}.gk-grid figure:nth-child(1){grid-row:auto;grid-column:1/-1;aspect-ratio:4/5}.gk-grid figure:nth-child(2){grid-column:1/-1;aspect-ratio:4/3}.gk-grid figure:nth-child(n+3){aspect-ratio:4/5}}

/* Boutons */
button,input[type=submit],.button,.more-link,.read-more,a.more-link{display:inline-flex;align-items:center;line-height:1.2;text-decoration:none!important;background:var(--accent)!important;color:var(--bg)!important;border:1px solid var(--accent)!important;border-radius:var(--r-sm)!important;font-weight:600!important;text-transform:none!important;letter-spacing:0!important;padding:13px 22px!important;transition:background-color 200ms ease,transform 160ms var(--ease-out)}
button:active,input[type=submit]:active,.more-link:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){button:hover,input[type=submit]:hover,.more-link:hover{background:var(--accent-hi)!important;border-color:var(--accent-hi)!important}}
.entry-content a.button{color:var(--bg)!important;margin:.4em 0 .8em}
.menu-toggle{background:transparent!important;border:0!important;padding:10px!important}

/* Formulaires */
input,textarea,select{background:var(--bg3)!important;color:var(--text)!important;border:1px solid var(--line2)!important;border-radius:var(--r-sm)!important}
input::placeholder,textarea::placeholder{color:#7f888b}

/* Listes d'articles et widgets */
.widget-title,.widget-title span,.widgettitle{color:var(--text)!important;font-size:1rem!important;text-transform:none!important;letter-spacing:0!important;border:0!important;background:none!important}
.widget-title:before,.widget-title:after{display:none!important}
.widget a{color:var(--muted)}

/* Pied de page */
.site-footer{border-top:1px solid var(--line)!important}
.site-footer *{border-color:var(--line)!important}
.site-info,.site-info a,.copyright{color:var(--muted)!important;text-transform:none!important;letter-spacing:0!important;font-size:.85rem!important}

/* Animations : zoom photo au survol, mouvement réduit respecté */
.entry-content img,.post-thumbnail img{transition:transform 600ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.post-thumbnail a:hover img{transform:scale(1.03)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Bloc d'opposition Matomo (page mentions légales) */
#matomo-opt-out{margin:.6em 0 1.6em;color:var(--text);font-weight:500}
#matomo-opt-out label{display:inline;color:var(--text)}
#matomo-opt-out input[type=checkbox]{display:inline-block;width:18px;height:18px;margin:0 .5em 0 0;vertical-align:-3px;accent-color:var(--accent);background:none!important;border:0!important}