/*
Theme Name: Othello
Description: Thème sur mesure, léger et rapide, pour la boutique Othello (TOBAGO SARL).
Version: 1.0.0
Requires PHP: 7.4
Text Domain: othello
*/
@font-face{font-family:"Jost";font-style:normal;font-weight:400 600;font-display:swap;src:url(assets/fonts/jost.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 700;font-display:swap;src:url(assets/fonts/cormorant.woff2) format("woff2")}
html{scroll-behavior:smooth}
body{margin:0;background:#FBF6F1}
a{color:#B02D25}a:hover{color:#B02D25;text-decoration:underline}
img,video{max-width:100%}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #F4B57A;outline-offset:2px}
.othello-msg{grid-column:1/-1;margin:0;padding:12px 16px;border-radius:10px;font-weight:500}
.othello-msg.ok{background:#E7F3EA;color:#1D5B2E}
.othello-msg.err{background:#FBE9E7;color:#8A1F18}
@media (max-width:640px){#rappel{grid-template-columns:1fr!important}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- Menu mobile ---------- */
.othello-burger{display:none}
@media (max-width:860px){
header>div{gap:12px!important;padding-top:10px!important;padding-bottom:10px!important}
.othello-logo{order:1}
.othello-logo img{width:58px!important;height:58px!important}
.othello-call{order:2;margin-left:auto;padding:12px 18px!important;font-size:15px!important;white-space:nowrap}
.othello-burger{order:3;display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:48px;height:48px;padding:0 13px;border:1px solid #EADFD6;border-radius:12px;background:#FFFFFF;cursor:pointer}
.othello-burger span{display:block;height:2px;background:#1E1513;border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.othello-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.othello-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.othello-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.othello-nav{order:4;flex-basis:100%;display:none!important;flex-direction:column!important;gap:0!important;border-top:1px solid #EADFD6}
.othello-nav.is-open{display:flex!important}
.othello-nav a{padding:15px 4px!important;border-bottom:1px solid #F1E7E0;font-size:17px!important}
.othello-nav a:last-child{border-bottom:0}
}
@media (max-width:420px){.othello-num{display:none}}
@media (prefers-reduced-motion:reduce){.othello-burger span{transition:none}}