/* Gut Feelings, gutfeelingsgame.com. Shares the Grosse Morsure site system. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/bricolage-grotesque-500.woff2) format('woff2'),url(../fonts/bricolage-grotesque-500.woff) format('woff')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/bricolage-grotesque-800.woff2) format('woff2'),url(../fonts/bricolage-grotesque-800.woff) format('woff')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-sans-400.woff2) format('woff2'),url(../fonts/instrument-sans-400.woff) format('woff')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/instrument-sans-500.woff2) format('woff2'),url(../fonts/instrument-sans-500.woff) format('woff')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/instrument-sans-600.woff2) format('woff2'),url(../fonts/instrument-sans-600.woff) format('woff')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/instrument-sans-700.woff2) format('woff2'),url(../fonts/instrument-sans-700.woff) format('woff')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jetbrains-mono-500.woff2) format('woff2'),url(../fonts/jetbrains-mono-500.woff) format('woff')}
a{color:#2A1610}a:hover{opacity:.78}
.btn{transition:transform .15s ease, box-shadow .15s ease}
.btn:hover{opacity:1;transform:translate(-2px,-2px);box-shadow:6px 6px 0 #2A1610 !important}
.card{transition:transform .2s ease}
.tilt-a{transform:rotate(-0.96deg)}.tilt-b{transform:rotate(0.8deg)}
.card:hover{transform:rotate(0) translateY(-6px)}
.chars-link:hover{opacity:1}.chars-link img{transition:transform .2s ease}.chars-link:hover img{transform:scale(1.035)}
.seal{transition:transform .25s ease}.seal:hover{opacity:1;transform:rotate(-6deg) scale(1.05)}
.flip{transform:scaleX(-1)}
.stamp{-webkit-mask-image:url(../img/stamp-mask.png);mask-image:url(../img/stamp-mask.png);-webkit-mask-size:300px 300px;mask-size:300px 300px}
.marquee{overflow:hidden;width:100%}
.track{display:flex;width:max-content;will-change:transform;animation:scroll 114s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.logo-slot{flex:0 0 auto;padding:0 44px;height:80px;display:flex;align-items:center}
@keyframes scroll{to{transform:translateX(-50%)}}
.copinos-bg{background-image:linear-gradient(180deg, rgba(14,44,53,.89), rgba(14,44,53,.94)), url(../img/background.jpg);background-size:cover;background-position:center}
.pill:hover{opacity:1;background:#2A1610;color:#FDE6DD !important}
.logo-slot img{max-width:none}

.tip{position:relative;cursor:help;outline:none}
.tip:focus-visible{outline:2px dashed #12D3B6;outline-offset:4px}
.tip-box{position:absolute;z-index:70;bottom:calc(100% + 12px);left:50%;width:280px;box-sizing:border-box;transform:translate(-50%,6px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,transform .15s ease,visibility .15s;background:#FFFFFF;color:#2A1610;border:2px solid #2A1610;border-radius:12px;box-shadow:4px 4px 0 #2A1610;padding:14px 16px;text-align:left;font-family:'Instrument Sans',system-ui,sans-serif;font-size:14px;font-weight:400;line-height:1.4;letter-spacing:0;text-transform:none}
.tip:hover .tip-box,.tip:focus .tip-box,.tip:focus-within .tip-box{opacity:1;visibility:visible;transform:translate(-50%,0)}
.tip-l .tip-box{left:0;transform:translate(0,6px)}
.tip-l:hover .tip-box,.tip-l:focus .tip-box{transform:translate(0,0)}
.tip-r .tip-box{left:auto;right:0;transform:translate(0,6px)}
.tip-r:hover .tip-box,.tip-r:focus .tip-box{transform:translate(0,0)}
.spec{transition:background .15s ease}
.spec:hover,.spec:focus{background:rgba(154,234,191,.1)}
.mot .mot-ic{transition:transform .15s ease}
.mot:hover .mot-ic,.mot:focus .mot-ic{transform:translate(-2px,-2px) rotate(-6deg)}
.tip-h{font-size:17px;line-height:1.15}
.pips{display:inline-flex;gap:6px}
.pip{width:14px;height:14px;box-sizing:border-box;border:1.5px solid #2A1610;border-radius:3px;transform:rotate(-15deg);background:transparent}
.pip.on{background:#143D4A}
.pip.sm{width:9px;height:9px;border-width:1.2px;border-radius:2px}

:root{--ts:1}
@media (min-width:1100px){.proj-head{gap:24px !important}.proj-row{margin-top:-48px}.proj-wrap{gap:8px !important}}
@media (max-width:640px){
:root{--ts:.75;--fl:1;--min:11px}
.st{--ts:1;--fl:0;--min:0px;zoom:.5}
.st-keep{--ts:1;--fl:0;--min:0px}
header.site{flex-direction:column !important;align-items:center !important;justify-content:center !important;gap:2px !important;padding:14px 16px 6px !important}
header.site .brand-name{font-size:24.2px !important}
header.site nav{flex-wrap:nowrap !important;gap:11px !important;width:100%;justify-content:center !important;align-items:center !important;font-size:12px !important}
header.site nav a{white-space:nowrap;padding:8px 0 !important}
header.site nav a.lang{padding:4px 9px !important;border-width:1.5px !important;box-shadow:2px 2px 0 #2A1610 !important;font-size:10px !important;margin-left:2px}
.brand-img{zoom:.6}
.foot-img{zoom:1}
section.hero{position:relative;flex-direction:column !important;flex-wrap:nowrap !important;align-items:flex-start !important;gap:18px !important;padding:22px 24px 48px !important}
.hero-left{display:contents !important}
.hero-logo{order:-1;flex:0 0 auto !important;align-self:center !important;width:172px !important;margin:0 !important}
.hero-logo img,.hero-logo canvas{width:100% !important}
.hero-stamp{order:-2;margin:0 0 -13px 6px !important}
.card{position:relative}
.card-sticker{position:relative;top:0px;margin:-16px -4px -16px 0 !important}
.pills{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px !important;width:100%;flex:1 1 100% !important}
.pill{font-size:13px !important;padding:7px 2px !important;text-align:center;white-space:nowrap;border-width:1.5px !important}
.stamp-row{flex-wrap:nowrap !important;gap:6px !important;justify-content:space-between !important}
.logo-slot{zoom:.5}
.track{animation-duration:60s}
.proj-head{gap:26px !important}
.proj-row{flex-direction:column !important;flex-wrap:nowrap !important;align-items:stretch !important;gap:26px !important}
.proj-row .fiche{order:-1}
.proj-row .stamp-row{flex:0 0 auto !important}

.fiche{flex:0 0 auto !important;position:relative;gap:8px !important;align-self:stretch !important;zoom:.8}
.spec{flex-direction:row !important;text-align:left !important;padding:2px 0 !important}
.spec > span:nth-child(2){align-items:flex-start !important}
.mot-name{font-size:11.5px !important;letter-spacing:-0.02em !important}
.mot-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:14px 6px !important;position:relative}
.mot-ic{width:46px !important;height:46px !important}
.tip{position:static}
.tip-box,.tip-l .tip-box,.tip-r .tip-box{left:0 !important;right:0 !important;width:auto;bottom:auto;top:calc(100% + 8px);transform:translateY(6px) !important}
.tip:hover .tip-box,.tip:focus .tip-box,.tip:focus-within .tip-box{transform:none !important}
.pip{width:10px;height:10px}
.pips{gap:4px}

}
@media (prefers-reduced-motion: reduce){.track{animation:none}.card,.btn{transition:none}}

/* Same system as grosse-morsure.com: Bricolage Grotesque display, Instrument Sans body, JetBrains Mono labels; teal #12D3B6, ink #2A1610, cream #FDE6DD, deep teal #0E2C35. Product sheet copied from the studio site, then a bubble membrane into the teal contact band. */

:root{color-scheme:dark}
html,body{background:#12D3B6}
body{margin:0}
.page{background:#12D3B6;color:#2A1610;font-family:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-size:17px;line-height:1.55;overflow-x:hidden;overflow-x:clip}
#projets{position:relative}
#projets > section{position:relative;z-index:1}
.membrane{display:block;width:100%;height:120px;margin-top:-20px;position:relative;z-index:0}
.membrane .drip{animation:rise var(--dur,8s) ease-in-out var(--delay,0s) infinite alternate;transform-box:fill-box;transform-origin:center}
@keyframes rise{from{transform:translateY(3px)}to{transform:translateY(-5px)}}

.follow{background:#12D3B6;color:#2A1610;margin-top:-1px}
.follow-wrap{max-width:1240px;margin:0 auto;padding:8px 24px 36px;display:flex;flex-direction:column;gap:48px}
.follow-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px 64px;align-items:center}
.contact{min-width:0;display:flex;flex-direction:column;gap:20px;container-type:inline-size}
.label{display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:500;letter-spacing:.1em;text-transform:uppercase}
.label i{width:12px;height:12px;background:#2A1610;border-radius:2px;transform:rotate(-15deg)}
.mail{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-0.015em;line-height:1.1;white-space:nowrap;font-size:clamp(14px,4.4vw,28px);color:#2A1610;text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.14em}
.follow .pills{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:560px}
.pill{text-align:center;white-space:nowrap;text-decoration:none;font-weight:600;font-size:15px;padding:11px 18px;border:2px solid #2A1610;border-radius:999px;color:#2A1610}

.stage{position:relative;min-width:0;display:grid;place-items:center;padding:12px 0}
.drift-x{animation:driftX 17s ease-in-out infinite alternate}
.drift-y{animation:driftY 11.3s ease-in-out infinite alternate}
.drift-d{animation:driftD 23.7s ease-in-out infinite alternate}
.roll{animation:roll 13.9s ease-in-out infinite alternate}
@keyframes driftX{from{transform:translateX(-8px)}to{transform:translateX(9px)}}
@keyframes driftY{from{transform:translateY(7px)}to{transform:translateY(-8px)}}
@keyframes driftD{from{transform:translate(3px,-2.5px)}to{transform:translate(-3.5px,3px)}}
@keyframes roll{from{transform:rotate(-2.25deg)}to{transform:rotate(1.75deg)}}
.creature{position:relative;display:block;width:min(100%,520px);max-width:100%;height:auto;user-select:none;-webkit-user-drag:none}

.foot-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;border-top:2px solid #2A1610;padding-top:22px;font-size:14px}
.studio{display:inline-flex;align-items:center;gap:12px;color:#2A1610;text-decoration:none}
.studio img{width:42px;height:35px;object-fit:contain}
.sig{display:flex;flex-direction:column;gap:2px}
.sig b{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:18px;letter-spacing:-0.01em}
.studio:hover .sig span{text-decoration:underline}
a:focus-visible{outline:2px dashed currentColor;outline-offset:4px}

@media (max-width:760px){
.follow-row{grid-template-columns:minmax(0,1fr)}
.stage{order:-1}
.creature{width:min(86%,400px)}
.membrane{height:90px;margin-top:-12px}
}
@media (prefers-reduced-motion:reduce){.drift-x,.drift-y,.drift-d,.roll,.membrane .drip{animation:none}}

@supports (font-size:1cqi){.mail{font-size:min(44px,5.35cqi)}}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
