/* Layout : menu fixe à gauche, Instagram fixe en haut à droite, grands titres SMEGS en arrière-plan ;
   un voile de grain papier (couche transparente) passe sur le fond et les titres, sous le contenu. DA v6. */
:root{
  --vert:#263123;          /* fond de marque */
  --creme:#efe1bc;         /* texte / logo */
  --ligne:#3a5536;
  --creme-doux:#b8ae8e;
  --accent:var(--creme);
  --titre:"Jost","Futura","Century Gothic",sans-serif;
  --corps:"Menlo Neon",Menlo,Monaco,Consolas,"DejaVu Sans Mono",monospace;
  --menu:270px;
  --th:300px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{overflow-x:clip}
body{background:var(--vert);color:var(--creme);font-family:var(--corps);font-size:15px;line-height:1.75;margin:0;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
a{color:inherit}
p{text-align:justify;hyphens:auto;-webkit-hyphens:auto}
:focus-visible{outline:1px dashed currentColor;outline-offset:4px}
/* grain papier : couche transparente fixe, au-dessus du fond et des titres, sous le contenu */
.grain{position:fixed;inset:0;pointer-events:none;}

/* ---------- Menu ---------- */
.menu{position:fixed;top:0;left:0;bottom:0;width:var(--menu);z-index:40;
  padding:calc(2.2rem + env(safe-area-inset-top,0px)) 1.5rem 2rem max(2.2rem,env(safe-area-inset-left,0px));
  display:flex;flex-direction:column;gap:5.5rem;pointer-events:none}
.menu>*{pointer-events:auto}
.logo{display:block;width:215px;max-width:100%}
.logo img{display:block;width:100%;height:auto}
.menu nav{display:flex;flex-direction:column;gap:.75rem}
.menu nav a{position:relative;text-decoration:none;font-size:1.05rem;width:max-content;transition:transform .25s ease,opacity .2s}
.menu nav a:hover{opacity:.7}
.menu nav a[aria-current="page"]::before{content:".";position:absolute;left:-1rem}
@media (min-width:1201px){.menu nav a[aria-current="page"]{transform:translateX(1rem)}}
.insta{position:fixed;z-index:40;top:calc(2rem + env(safe-area-inset-top,0px));right:max(2rem,calc(env(safe-area-inset-right,0px) + 1rem));font-size:.8rem;text-decoration:none}
.insta:hover{text-decoration:underline}

/* ---------- Grands titres en arrière-plan ---------- */
main{margin-left:var(--menu);position:relative}
.titre{position:fixed;top:0;left:var(--menu);right:0;margin:0;padding:0 1.5vw .45em;
  text-align:center;white-space:nowrap;pointer-events:none;font-family:var(--titre);font-weight:400;line-height:1.2;
  color:var(--accent);font-size:200px}
.contenu{position:relative;padding:calc(var(--th) * var(--decal,.6)) clamp(1rem,7vw,7rem) 8rem clamp(1rem,3vw,3rem)}

/* ---------- Médias ---------- */
.photo{display:block;width:100%;height:auto;background:#2f3c2c}
.dessin{display:block;width:100%;background:var(--c,var(--accent));
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.provisoire{font-size:.68rem;color:var(--creme-doux);display:block;margin-bottom:.6rem}


/* ---------- Accueil (page fixe) ---------- */
.accueil{min-height:100vh;display:flex;flex-direction:column;justify-content:center;gap:clamp(1.2rem,3.5vh,2.6rem);padding:2rem clamp(1rem,7vw,7rem) 2rem clamp(1rem,3vw,3rem)}
.intro{display:grid;grid-template-columns:1fr minmax(0,38rem) 1fr;gap:2.5rem;align-items:center}
.intro .dessin{width:min(120px,16vh);justify-self:center;position:relative;z-index:2}
.intro .texte p{margin:0 0 1em;position:relative;z-index:2}
.intro .texte .cta{text-align:center;margin:1.4rem 0 0}
.cta a{display:inline-block;text-decoration:none;border:1px solid var(--creme);padding:.6rem 1.4rem;font-size:.85rem;letter-spacing:.04em;transition:background .2s,color .2s}
.cta a:hover{background:var(--creme);color:var(--vert)}
.intro .provisoire{text-align:center;position:relative;z-index:2}
.titre-accueil{position:relative;z-index:0;font-family:var(--titre);font-weight:400;margin:-.12em 0 -.22em;text-align:center;line-height:.62;padding-bottom:.32em;color:#9f9c80}
.titre-accueil span{display:block;white-space:nowrap}
.acc1 .accueil{justify-content:flex-start;padding-top:.6rem;gap:clamp(.8rem,2vh,1.6rem)}
.acc1 .bandeau{margin-top:auto}
.bandeau{position:relative;z-index:2;overflow:hidden;align-self:flex-start}
.piste{display:flex;gap:1.4rem;width:max-content;will-change:transform}
.piste a{flex:none;width:min(210px,24vh);display:block}
.piste img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;background:#2f3c2c}
body.fixe{overflow:hidden}
body{display:block!important;padding-top:0!important}
/* la classe .accueil posée sur body ne doit pas lui donner les marges asymétriques du bloc d'accueil */
body.accueil{padding:0 max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))!important;min-height:0!important}
/* variante : menu en haut, logo au centre, titre vertical */
body.alt{--menu:0px}
body.alt .menu{display:none}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.titre-vertical{position:fixed;left:0;top:0;bottom:0;margin:0;writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;
  font-family:var(--titre);line-height:1;color:var(--accent);opacity:.4;pointer-events:none;white-space:nowrap;font-size:200px;padding:0 .05em}
.alt-tete{position:relative;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.2rem clamp(1rem,7vw,7rem) 2rem var(--gauche-alt,12rem)}
.menu-haut{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 2.2rem;font-family:var(--corps);font-size:.9rem;line-height:1.4}
.menu-haut a{text-decoration:none;transition:opacity .2s}.menu-haut a:hover{opacity:.65}
.alt-logo{width:min(560px,70%)}.alt-logo img{display:block;width:100%;height:auto}
.tete-centre{position:relative;display:flex;flex-direction:column;align-items:center;gap:.7rem;padding:1rem 0 0}
.logo-centre{width:min(300px,40vw)}.logo-centre img{display:block;width:100%;height:auto}
.tete-centre .menu-haut{font-weight:700}
.titre.titre-flux{position:sticky;left:auto;right:auto;top:-.25em!important;z-index:0;padding:0 0 .3em;margin:-.38em 0 -.4em;color:color-mix(in srgb,var(--accent) 55%,var(--vert))}
.contenu-centre{position:relative;z-index:1;padding:0 clamp(2rem,11vw,11rem) 8rem!important}
.alt-contenu{position:relative;padding:0 clamp(1rem,7vw,7rem) 4rem var(--gauche-alt,12rem)}
/* accueil 2 : menu en haut, grand logo remonté au maximum, croquis à l'horizontale de part et d'autre du texte */
.accueil-b{min-height:0;justify-content:flex-start!important;padding:0 clamp(1rem,4vw,4rem) 0;align-items:center;justify-content:flex-start;gap:clamp(.3rem,1vh,.8rem)}
.accueil-b .menu-haut{padding:.6rem 0 0;margin-bottom:2rem!important}
.accueil-b .grand-logo{margin-bottom:2rem}
.accueil-b .bandeau{margin-top:1.6rem!important}
.accueil-b .menu-haut{margin:0;font-weight:700}
.grand-logo{margin:0;width:min(260px,36vw)}
.grand-logo img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.scene{display:flex;justify-content:center;align-items:center;gap:clamp(1.5rem,4vw,4rem);width:100%}
.accueil-b .texte{flex:0 0 min(33rem,100%);min-width:0;font-size:11.5px;line-height:1.55}
.accueil-b .texte .provisoire{text-align:center}
.accueil-b .texte p{margin:0 0 .9em}
.accueil-b .texte .cta{text-align:center;margin:1.4rem 0 0}
.accueil-b .cta a{border:0;padding:.2rem 0;text-decoration:underline;text-underline-offset:.3em}
.accueil-b .cta a:hover{background:none;color:var(--creme);opacity:.7}
.accueil-b .texte .cta a{padding:.4rem 1.2rem}
.cote{display:flex;flex-direction:row;align-items:center;gap:clamp(1.2rem,2.5vw,2.5rem);flex:none}
.cote .dessin{width:min(80px,9vh)}
.scene{overflow:hidden}
@media (max-width:1500px){.cote .n3{display:none}}
@media (max-width:1250px){.cote .n2{display:none}}
@media (max-width:1000px){.cote .n1{display:none}}
.accueil-b .bandeau{margin-top:.4rem}
.accueil-b .piste a{width:min(240px,28vh)}

/* ---------- En-tête commun en haut, titres dans le flux qui restent derrière le contenu ---------- */
:root{--menu:0px!important}
.menu{display:none!important}
body.accueil2 #tete{display:none}
#tete{padding-top:0;gap:2.55rem;margin-bottom:1.25rem}
.accueil.accueil-b{padding-top:0!important}
#tete .menu-haut{padding:.6rem 0 0}
.logo-centre{width:min(260px,36vw)!important}
.titre{position:sticky!important;top:-.2em!important;left:auto!important;right:auto!important;z-index:0;margin:-.32em 0 -.42em;padding:0 0 .3em;
  color:color-mix(in srgb,var(--accent) 55%,var(--vert))}
.contenu{position:relative;z-index:1;padding-top:.4rem!important}
.contenu-centre,section[data-page] .contenu{padding-left:clamp(1.5rem,8vw,9rem)!important;padding-right:clamp(1.5rem,8vw,9rem)!important}
.acc1 .accueil{min-height:0;padding-left:clamp(1rem,5vw,5rem)!important;padding-right:clamp(1rem,5vw,5rem)!important}

/* ---------- L'agence 2 : photo fixe d'un côté, texte de l'autre ---------- */
.info{position:relative;z-index:1;margin-top:-1rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);
  padding:1.6rem clamp(1.5rem,8vw,9rem) 4rem;align-items:start}
.info-photo{margin:0;position:sticky;top:1.5rem}
.info-photo img{display:block;width:100%;height:auto;max-height:calc(100vh - 3rem);object-fit:contain;object-position:top}
.info-texte{max-width:36rem;font-size:13.5px;line-height:1.75}
.info-texte p{margin:0 0 1.2em}
.info-coord{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2.6rem;padding-bottom:1.6rem;border-bottom:1px solid var(--ligne);font-size:12px}
.info-coord p{text-align:left;margin:0;color:color-mix(in srgb,var(--creme) 75%,var(--vert))}
.info-lien{margin-top:2.4rem!important;text-align:left!important}
.info-lien a{font-family:var(--titre);font-size:2.4rem;line-height:1.1;text-decoration:none;color:color-mix(in srgb,var(--creme) 70%,var(--vert));transition:color .2s}
.info-lien a:hover{color:var(--creme)}
@media (max-width:820px){.info{grid-template-columns:1fr;padding:1rem 0 3rem}.info-photo{position:static;max-width:30rem;justify-self:center}.info-coord{grid-template-columns:1fr}}

/* ---------- Liste des projets ---------- */
.grille-projets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.carte{position:relative;display:block;overflow:hidden;text-decoration:none}
.carte .photo{aspect-ratio:3/4;object-fit:cover;transition:transform .6s ease,filter .4s}
.carte .filtre{position:absolute;inset:0;background:var(--c);mix-blend-mode:multiply;opacity:0;transition:opacity .35s}
.carte .voile{position:absolute;inset:0;background:var(--vert);opacity:0;transition:opacity .35s}
.carte .nom{position:absolute;left:0;right:0;top:50%;transform:translateY(-55%);text-align:center;white-space:nowrap;
  font-family:var(--titre);color:var(--c);line-height:1.2;opacity:0;transition:opacity .3s}
.carte .infos{position:absolute;left:0;right:0;bottom:1rem;text-align:center;font-size:.74rem;color:var(--creme);opacity:0;transition:opacity .3s}
.carte:hover .photo,.carte:focus-visible .photo{transform:scale(1.03);filter:grayscale(1) contrast(1.05)}
.carte:hover .filtre,.carte:focus-visible .filtre{opacity:.9}
.carte:hover .voile,.carte:focus-visible .voile{opacity:.45}
.carte:hover .nom,.carte:hover .infos,.carte:focus-visible .nom,.carte:focus-visible .infos{opacity:1}

/* ---------- Page projet ---------- */
.colonnes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4rem;align-items:start}
.col{display:flex;flex-direction:column;gap:2.4rem;min-width:0}
.col[data-col="2"]{padding-top:7rem}
.col[data-col="3"]{padding-top:3rem}
.col .dessin{width:44%;margin-inline:auto}
.texte-projet{font-size:12.5px;line-height:1.75}
.texte-projet p{margin:0 0 1em}.texte-projet p:last-child{margin:0}
.fiche{display:grid;grid-template-columns:auto 1fr;gap:.15rem 1.4rem;margin:0 0 1.2rem;font-size:11.5px}
.fiche dt{color:var(--accent)}.fiche dd{margin:0}
.credit{font-size:11px;color:var(--creme-doux)}
.intro-projet{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:2.4rem 5rem;align-items:start;margin-bottom:6rem;
  position:sticky;top:var(--haut-fixe,0px)}
.intro-projet .plans{display:contents}
.intro-projet .indice{display:none}
.colonnes{position:relative}
.col{position:relative}
/* croquis en négatif sur le titre : un calque vert, découpé à la forme du titre, posé dans le croquis */
.col .dessin{position:relative}
.negatif{position:absolute;inset:0;background:var(--vert);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;pointer-events:none}
@media (max-width:820px){.negatif{display:none}}
.col h2{font-family:var(--titre);font-weight:400;font-size:2.3rem;line-height:1.15;margin:0 0 .6rem;color:var(--accent)}
.intro-projet .texte-projet{text-shadow:0 0 3px var(--vert),0 0 9px var(--vert)}
.intro-projet figure{margin:0;padding:0 2.2rem}
.intro-projet figcaption{font-size:11.5px;color:var(--accent);margin-top:.8rem}
.intro-projet .plan-vide{aspect-ratio:4/3;border:1px dashed var(--accent);display:grid;place-items:center;font-size:11.5px;color:var(--creme-doux)}
.suite{display:flex;justify-content:space-between;margin-top:3rem;font-size:.85rem}

/* ---------- À propos : même principe que les pages projet ---------- */
.colonnes-apropos .texte-projet{font-size:13px}
.colonnes-apropos .col>.photo{width:76%}
.colonnes-apropos .col[data-col="3"]>.photo,.colonnes-apropos .col>.photo:nth-of-type(2){align-self:flex-end}

/* ---------- Contact ---------- */
.papier{max-width:40rem;margin-inline:auto;background:#e9dfc6 url(/assets/media/957fb5e370.jpg) center/700px repeat;color:var(--vert);
  padding:3.5rem clamp(1.4rem,5vw,4rem) 3rem;text-align:center;text-transform:uppercase;letter-spacing:.02em;box-shadow:0 30px 60px -30px #0008}
.papier p{margin:0;text-align:center}
.papier .intro-contact{text-transform:none;letter-spacing:0;font-size:.9rem;margin-bottom:2rem;text-align:justify}
.papier .bloc{margin-block:.5rem}
.papier form{margin-top:2.2rem}
.papier .entre{display:grid;grid-template-columns:72px 1fr 72px;align-items:center;gap:1rem}
.papier .entre .dessin{--c:var(--vert)}
.papier .appel{font-weight:700;letter-spacing:.08em;margin-top:2.6rem;font-size:1.05rem}
form{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.4rem;text-align:left;text-transform:none;margin-top:1.8rem}
form .plein{grid-column:1/-1}
form label{display:flex;flex-direction:column;gap:.2rem;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
form input,form textarea{font:inherit;font-size:.92rem;letter-spacing:0;text-transform:none;color:var(--vert);background:transparent;border:0;border-bottom:1px solid var(--vert);padding:.35rem 0;border-radius:0}
form textarea{border:1px solid var(--vert);padding:.6rem;min-height:8rem;resize:vertical}
form input:focus,form textarea:focus{outline:none;border-color:#d5724b}
form button{grid-column:1/-1;justify-self:center;font:inherit;font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;color:var(--creme);background:var(--vert);border:0;padding:.8rem 2.4rem;cursor:pointer;margin-top:.8rem}
form button:hover{background:#2a4a26}
form .statut{grid-column:1/-1;text-align:center;font-size:.8rem;min-height:1.4em}

.pied{position:relative;z-index:41;margin-left:calc(-1 * max(16px,env(safe-area-inset-left,0px)));margin-right:calc(-1 * max(16px,env(safe-area-inset-right,0px)));display:flex;justify-content:space-between;align-items:center;gap:1rem;white-space:nowrap;
  padding:.9rem clamp(1rem,7vw,7rem) .9rem max(2.2rem,env(safe-area-inset-left,0px));font-size:.78rem;
  background:var(--vert)}
body.accueil .pied{display:none}
.pied a{text-decoration:none}.pied a:hover{text-decoration:underline}
.pied span:last-child{text-align:right}
.pied span:nth-child(3){text-align:center}
.note-maquette{position:fixed;z-index:40;bottom:calc(1rem + env(safe-area-inset-bottom,0px));right:max(1rem,env(safe-area-inset-right,0px));
  font-size:.66rem;color:var(--creme-doux);background:var(--vert);border:1px solid var(--ligne);padding:.35rem .7rem}

/* ---------- Fenêtre moyenne : le menu passe en bandeau en haut, la mise en page reste en colonnes ---------- */
@media (max-width:1200px){
  :root{--menu:0px}
  .menu{position:sticky;top:0;bottom:auto;width:auto;flex-direction:row;justify-content:space-between;align-items:center;gap:.6rem;background:var(--vert);
    margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)));padding:1rem max(16px,env(safe-area-inset-right,0px)) .8rem max(16px,env(safe-area-inset-left,0px))}
  .logo{width:110px;flex:none}
  .menu nav{flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.2rem 1rem;padding-top:0}
  .menu nav a{font-size:.8rem}
  .menu nav a[aria-current="page"]{padding-left:.7rem}
  .menu nav a[aria-current="page"]::before{left:0}
  .pied{padding:.8rem max(16px,env(safe-area-inset-left,0px))}
  .contenu{padding-right:clamp(1rem,3vw,3rem)}
}
@media (max-width:1200px){
  /* l'agence : deux colonnes, texte et photo côte à côte */
  .colonnes.colonnes-apropos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.4rem 2.6rem;align-items:center}
  .colonnes.colonnes-apropos .col{display:contents}
  .colonnes.colonnes-apropos .col>*{order:var(--o)}
  .colonnes.colonnes-apropos .col>.photo{width:100%;max-width:26rem;justify-self:center;aspect-ratio:auto;height:auto}
  .colonnes.colonnes-apropos .col>.dessin{width:40%;max-width:160px;justify-self:center;aspect-ratio:auto!important;padding:0}
  [data-page="apropos"] [data-s]{top:0!important}
}
@media (max-width:820px){
  .colonnes.colonnes-apropos{grid-template-columns:1fr;gap:1.8rem}
  .colonnes.colonnes-apropos .col>*{grid-column:1/-1}
  .colonnes.colonnes-apropos .col>.photo{width:78%}
}
/* ---------- Mobile ---------- */
@media (max-width:820px){.contenu-centre,section[data-page] .contenu{padding-left:0!important;padding-right:0!important}}
@media (max-width:820px),(hover:none){
  .carte .voile{opacity:1;background:linear-gradient(transparent 45%,color-mix(in srgb,var(--vert) 85%,transparent))}
  .carte .nom{top:auto;bottom:2.4rem;transform:none}
  .carte .nom,.carte .infos{opacity:1}
  .carte .infos{font-size:.62rem;bottom:.5rem;padding-inline:.3rem}
}
@media (max-width:820px){
  .menu nav{gap:.2rem .6rem}
  .menu nav a{font-size:.7rem}
  .menu nav .lien-insta{display:none}
  .pied{font-size:clamp(.5rem,2.6vw,.75rem);gap:.5rem}
  .titre{position:relative;left:auto;top:auto!important;padding:0 0 .3em;margin:-.15em 0 -.25em;line-height:1}
  .contenu{padding:.2rem 0 5rem}
  .accueil{min-height:0;padding:1rem 0 2rem}
  .titre-vertical{opacity:.25}
  .menu-haut{font-size:.8rem;gap:.2rem 1rem}
  .alt-tete{padding-inline:0 0}
  .alt-contenu{padding:0 0 3rem var(--gauche-alt,3.5rem)}
  .cote{display:none}
  .accueil-b{padding-inline:0}
  .intro,form{grid-template-columns:1fr}
  .intro-projet{position:static;grid-template-columns:1fr;gap:1rem;margin-bottom:2.5rem}
  .intro-projet .plans{display:flex;gap:2.5rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)));padding-inline:max(16px,env(safe-area-inset-left,0px))}
  .intro-projet .plans figure{flex:0 0 72%;scroll-snap-align:center;padding:0}
  .intro-projet .plans figure.apres{order:-1}
  .intro-projet .indice{display:block;margin:0;font-size:11px;color:var(--creme-doux);text-align:right}
  .intro .dessin{display:none}
  .grille-projets{grid-template-columns:1fr 1fr;gap:.8rem}
  .colonnes{grid-template-columns:1fr 1fr;gap:1rem}
  .col{display:contents}
  .col>*{grid-column:1/-1}
  .col>.photo{grid-column:auto;aspect-ratio:auto;object-fit:contain;align-self:start}
  .col>.dessin{grid-column:auto;width:100%;aspect-ratio:3/4!important;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-origin:content-box;mask-origin:content-box;padding:16%;box-sizing:border-box}
  /* l'agence : le texte d'abord, des photos plus petites qui alternent à gauche et à droite */
  [data-s]{top:0!important}
  .note-maquette{display:none}
}

/* Typo v8 : Helvetica partout ; menus en Léger, textes en Courant 10 pt ; logo avec baseline recalibrée, -25 % */
:root{--corps:"Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif}
body{font-family:var(--corps)}
.menu nav a,.menu-haut,.menu-haut a,.tete-centre .menu-haut,.accueil-b .menu-haut,.insta,.suite,.suite a,.pied,.pied a{font-family:var(--corps);font-weight:300!important}
p,.texte,.accueil-b .texte,.texte-projet,.colonnes-apropos .texte-projet,.info-texte,.info-coord,.fiche,.credit,figcaption,.intro-projet figcaption,.papier .intro-contact,.carte .infos,.provisoire{font-family:var(--corps);font-weight:400;font-size:10pt!important;line-height:1.5}
.logo{width:290px}
.logo-centre{width:min(222px,40vw)!important}
.grand-logo{width:min(222px,40vw)}
@media (max-width:1200px){.logo{width:150px}}

/* ---------- V35 : plus de SMEGS, pages sur fond papier, titres en Jost gras dans le papier ---------- */
.titre-ancien{display:none!important}
.negatif{display:none!important}
.titre-papier{font-family:"Jost","Futura","Century Gothic",sans-serif;font-weight:700;font-size:clamp(2rem,3.6vw,3.2rem);line-height:1;letter-spacing:-.01em;margin:0 0 1.6rem;color:var(--vert);text-align:left}
.papier-page{background:#e9dfc6 url(/assets/media/957fb5e370.jpg) center/700px repeat;color:#1f2a1d;max-width:72rem;margin:1rem auto 4rem!important;
  padding:3.5rem clamp(1.4rem,4.5vw,4.5rem) 4rem!important;box-shadow:0 30px 60px -30px #0008;position:relative}
.papier-page p,.papier-page dd{color:#1f2a1d;text-shadow:none!important}
.papier-page .texte-projet{text-shadow:none!important}
.papier-page .fiche dt,.papier-page figcaption,.papier-page .credit,.papier-page .info-coord p{color:color-mix(in srgb,var(--vert) 70%,#e9dfc6)!important}
.papier-page .dessin{--c:var(--vert)!important;background:var(--vert)!important}
.papier-page .suite a,.papier-page a{color:var(--vert)}
.papier-page .info-coord{border-bottom-color:color-mix(in srgb,var(--vert) 25%,#e9dfc6)}
.papier-page .info-lien a{font-family:"Jost",sans-serif;font-weight:600;font-size:1.6rem;color:var(--vert)}
.info.papier-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.info.papier-page .info-titre{grid-column:1/-1;margin-bottom:.4rem}
.papier .titre-papier{text-align:center;text-transform:none;margin-bottom:1.8rem}
.carte .nom{font-weight:700}
.contenu.papier-page .intro-projet{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:2.4rem 3rem}
.contenu.papier-page .intro-projet .plans{display:grid;grid-template-columns:1fr 1fr;gap:2.4rem}
.contenu.papier-page .intro-projet .texte-projet,.contenu.papier-page .intro-projet figure{background:transparent}
@media (max-width:820px){.papier-page{padding:2rem 1.2rem 2.5rem!important;margin:0 calc(-1 * max(16px,env(safe-area-inset-left,0px))) 2rem!important}
  .info.papier-page,.contenu.papier-page .intro-projet{grid-template-columns:1fr}
  .contenu.papier-page .intro-projet .plans{display:flex}}

/* ---------- V36 ---------- */
.papier .titre-papier{text-align:left!important}
.carte .nom{font-family:"Jost","Futura",sans-serif;font-weight:700}
.info.papier-page{padding-top:2.4rem!important}
.info-photo{position:sticky;top:1.5rem}
.info-photo .info-titre{position:absolute;left:1.4rem;top:1.2rem;margin:0;color:var(--creme);text-shadow:0 2px 18px #0006}
.info-texte h2{font-family:"Jost","Futura",sans-serif;font-weight:700;font-size:1.25rem;line-height:1.2;margin:1.8rem 0 .6rem;color:var(--vert)}
.info-texte .info-coord+h2{margin-top:0}
.contenu.papier-page .intro-projet{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)!important}
.plans-defile{position:relative;overflow:hidden;display:block!important}
.defile-piste{display:flex;transition:transform .5s ease}
.defile-piste figure{flex:0 0 100%;margin:0;padding:0 3rem 0 0!important}
.defile-piste .dessin{height:min(56vh,34rem);width:auto;max-width:100%;margin-inline:auto}
.plans-defile.montre-avant .defile-piste{transform:translateX(-100%)}
.defile-fleche{position:absolute;right:0;top:40%;width:2.2rem;height:2.2rem;border-radius:50%;border:1px solid var(--vert);background:#e9dfc6;color:var(--vert);font-size:1.1rem;cursor:pointer;line-height:1;padding:0}
.defile-fleche:hover{background:var(--vert);color:#e9dfc6}
.plans-volet{display:block!important}
.plans-volet .volet-cadre{position:relative;cursor:ew-resize}
.plans-volet .volet-cadre>.dessin{width:100%}
.volet-avant{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x,0%)) 0 0);background:#e9dfc6 url(/assets/media/957fb5e370.jpg) center/700px}
.volet-avant .dessin{width:100%;height:100%;aspect-ratio:auto!important}
.volet-ligne{position:absolute;top:0;bottom:0;left:var(--x,0%);width:1px;background:var(--vert);opacity:0;transition:opacity .2s}
.volet-cadre.actif .volet-ligne{opacity:.6}
.volet-cadre:not(.actif) .volet-avant{clip-path:inset(0 100% 0 0)}
.plan-legende{display:flex;justify-content:space-between;font-size:.8rem;margin:.8rem 0 0!important;color:color-mix(in srgb,var(--vert) 70%,#e9dfc6)!important}
@media (max-width:820px){.contenu.papier-page .intro-projet{grid-template-columns:1fr!important}.intro-projet .plans-defile{margin:0!important;padding:0!important}}

/* ---------- V37 ---------- */
.logo-centre{width:min(200px,36vw)!important}
.grand-logo{width:min(200px,36vw)!important}
.menu-haut,.menu-haut a{font-size:.82rem!important}
#tete{margin-bottom:2.4rem!important}
.contenu.papier-page .intro-projet{margin-bottom:2.2rem!important}
.defile-piste .dessin{height:min(40vh,24rem)!important}
.plans-volet .volet-cadre{width:min(100%,calc(var(--h,40vh) * var(--r,1.23)));margin-inline:auto}
.plans-volet .plan-legende{width:min(100%,calc(var(--h,40vh) * var(--r,1.23)));margin-inline:auto!important}
.papier-page [class*="-plan-avant"]{background:color-mix(in srgb,var(--vert) 45%,#e9dfc6)!important}

/* ---------- V38 ---------- */
.grille-projets{max-width:min(100%,calc((100vh - 230px) * 1.55))!important;margin-inline:auto}
.carte .nom{top:30%!important;bottom:auto!important;transform:none!important}
.carte-croquis{position:absolute;left:50%;top:58%;width:28%;transform:translateX(-50%);background:var(--creme)!important;opacity:0;transition:opacity .3s;pointer-events:none}
.carte:hover .carte-croquis,.carte:focus-visible .carte-croquis{opacity:.9}
@media (max-width:820px),(hover:none){.carte .nom{top:auto!important;bottom:2.4rem!important}.carte-croquis{display:none}}
.plan-legende{justify-content:center!important;position:relative}
.plan-legende span{transition:opacity .2s}
.leg-apres{color:var(--vert)}
.leg-avant{position:absolute;left:0;right:0;text-align:center;opacity:0;color:color-mix(in srgb,var(--vert) 45%,#e9dfc6)}
.vue-avant .leg-apres{opacity:0}.vue-avant .leg-avant{opacity:1}
.info-texte{position:relative}
.info-texte>*:not(.fond-croquis){position:relative;z-index:1}
.papier-page .info-texte .fond-croquis{background:#8b9c88!important}
.info-texte>p,.info-texte>h2,.info-texte>div{position:relative;z-index:1}
.fond-croquis{position:absolute!important;z-index:0;left:50%;top:38%;width:78%;transform:translateX(-50%);background:color-mix(in srgb,var(--vert) 9%,#e9dfc6)!important;pointer-events:none}

/* ---------- V39 ---------- */
.grille-projets{max-width:min(100%,calc((100vh - 230px) * 1.75))!important}
.carte .nom{top:9%!important}
.carte-croquis{top:50%!important;transform:translate(-50%,-50%)!important;width:30%!important;background:var(--c)!important}
.carte:hover .carte-croquis,.carte:focus-visible .carte-croquis{opacity:1}
.carte .infos{color:var(--creme)!important}
.papier-page .info-texte .fond-croquis{background:#8b9c88!important;opacity:.45}
@media (max-width:820px){
  .info.papier-page{margin:0 0 2rem!important;padding:1.6rem 1.3rem 2rem!important}
  .info-photo{max-width:78%;margin-inline:auto!important}
  .fond-croquis{display:none}
}

/* ---------- L'agence 2 : photo sur le fond vert, texte sur une carte papier ---------- */
.info2{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);max-width:72rem;margin:0 auto 4rem;align-items:start}
.info2-photo{margin:0;position:sticky;top:1.5rem}
.info2-photo img{display:block;width:100%;height:auto;max-height:calc(100vh - 3rem);object-fit:cover}
.info2-papier{margin:0!important;max-width:none!important;padding:3rem clamp(1.6rem,3.5vw,3.4rem) 3rem!important;position:relative;overflow:hidden}
.info2-papier .titre-papier{position:relative;z-index:1;margin-bottom:1.4rem}
.info2-papier .info-texte{max-width:none;position:relative;z-index:1}
.info2-papier .fond-croquis{position:absolute!important;left:50%;top:45%;width:60%;transform:translateX(-50%);background:#8b9c88!important;opacity:.45;z-index:0}
@media (max-width:820px){.info2{grid-template-columns:1fr;gap:1.5rem}.info2-photo{position:static;max-width:78%;margin-inline:auto}.info2-papier .fond-croquis{display:none}}


@font-face{font-family:"Sick Day";src:url(/assets/fonts/sick-day.woff) format("woff");font-weight:400;font-display:block}
@font-face{font-family:"Serious Sans";src:url(/assets/fonts/serious-sans.woff) format("woff");font-weight:400;font-display:block}
@font-face{font-family:"Serious Sans";src:url(/assets/fonts/serious-sans-bold.woff) format("woff");font-weight:700;font-display:block}
:root{--texte:"Serious Sans","Helvetica Neue",Helvetica,Arial,sans-serif}
p,.texte,.accueil-b .texte,.texte-projet,.colonnes-apropos .texte-projet,.info-texte,.info-coord,.fiche,.credit,figcaption,.intro-projet figcaption,.papier .intro-contact,.carte .infos,.provisoire,.fiche dt,.fiche dd,.info-texte p{font-family:var(--texte)!important}
.titre-papier.titre-projet{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;font-size:clamp(2.4rem,3.9vw,3.5rem)!important;white-space:nowrap;letter-spacing:0!important;line-height:1!important}
.carte .nom{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;letter-spacing:0!important}
.info-texte h2{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;font-size:1.75rem!important;letter-spacing:0!important;line-height:1.1!important}
.cta,.cta a{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;font-size:1.6rem!important;letter-spacing:0!important}
.titre-papier:not(.titre-projet){font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:700!important;text-transform:uppercase;letter-spacing:.01em!important}
/* V53 */
.cta,.cta a{font-size:1.2rem!important}
.cta a{text-decoration:none!important}
.info-texte h2{font-size:1.15rem!important;margin:1.6rem 0 0!important;line-height:1.2!important}
.info-texte h2+p{margin-top:0!important}
.titre-papier.titre-projet{font-size:1.9rem!important;text-transform:uppercase;margin:0!important;line-height:1.05!important}
.titre-papier.titre-projet+p{margin-top:.1rem!important}
.texte-projet .fiche{margin:1.6rem 0 0 2.4rem!important;grid-template-columns:7.5rem 1fr!important;gap:0 1rem!important;line-height:1.35!important}
.texte-projet .fiche dt{font-weight:700!important;color:var(--vert)!important}
.texte-projet .fiche dd{color:#1f2a1d}
.logo-centre,.grand-logo{container-type:inline-size;display:block;text-decoration:none!important}
.logo-centre::after,.grand-logo::after{content:"ARCHITECTURE D\2019INT\C9RIEUR";display:block;font-family:"Serious Sans","Helvetica Neue",sans-serif;font-weight:400;font-size:calc(100cqw / 11.85);line-height:1;margin-top:.35em;white-space:nowrap;color:var(--creme);text-align:left;letter-spacing:0}
.menu-haut,.menu-haut a{font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:400!important}
/* V54 */
.titre-papier:not(.titre-projet){font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;letter-spacing:0!important}
.info-texte h2{font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:700!important;text-transform:uppercase;font-size:.95rem!important;letter-spacing:.02em!important}
.titre-papier.titre-projet{font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:700!important;font-size:1.6rem!important;letter-spacing:.01em!important}
.texte-projet .fiche,.texte-projet .fiche dt,.texte-projet .fiche dd{font-family:"Sick Day","Serious Sans",sans-serif!important;font-size:1.05rem!important}
.texte-projet .fiche dt{font-weight:400!important}
.texte-projet .fiche{line-height:1.25!important}
.plans-volet.sans-avant .volet-cadre{cursor:default}
.info-lien,.info-lien a{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;font-size:1.2rem!important;letter-spacing:0!important}
/* V55 */
:root{--trait:url(/assets/media/2176e57e1a.png);--trait-v:url(/assets/media/1860ab0d5d.png)}
.titre-papier:not(.titre-projet){text-transform:none!important}
.info-coord{border-bottom:0!important;position:relative;padding-bottom:2.2rem!important}
.info-coord::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:color-mix(in srgb,var(--vert) 25%,#e9dfc6);-webkit-mask:var(--trait) center/100% 100% no-repeat;mask:var(--trait) center/100% 100% no-repeat}
.info-coord a{color:inherit;text-decoration:none}
.volet-ligne{width:12px!important;margin-left:-6px;background:var(--vert)!important;-webkit-mask:var(--trait-v) center/100% 100% no-repeat;mask:var(--trait-v) center/100% 100% no-repeat}
.volet-cadre.actif .volet-ligne{opacity:.8!important}
.volet-fleche{display:none}
/* contact : blocs resserrés */
.papier .intro-contact~p,.papier .entre,.papier .entre p{margin-block:0!important}
.papier .entre{display:block!important;position:relative;text-align:center}
.papier .entre .dessin{position:absolute!important;top:50%;transform:translateY(-50%);width:72px}
.papier .entre .dessin:first-child{left:0}.papier .entre .dessin:last-child{right:0}
.papier .entre+p{margin-bottom:2.4rem!important}
@media (max-width:820px),(hover:none){
  .plans-volet{position:relative;min-width:0;width:100%;max-width:100%}
  .intro-projet{min-width:0}
  .plans-volet .volet-cadre{width:100%!important;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:default}
  .plans-volet .volet-cadre::-webkit-scrollbar{display:none}
  .plans-volet .volet-cadre>.dessin{flex:0 0 100%;scroll-snap-align:start}
  .plans-volet .volet-avant{position:relative!important;inset:auto!important;flex:0 0 100%;clip-path:none!important;scroll-snap-align:start;background:none!important}
  .plans-volet .volet-avant .dessin{height:auto!important;aspect-ratio:var(--r)!important}
  .volet-ligne{display:none!important}
  .plans-volet .plan-legende{width:100%!important}
  .volet-fleche{display:block;position:absolute;right:0;top:calc(50% - 1.6rem);width:2.2rem;height:2.2rem;border-radius:50%;border:1px solid var(--vert);background:#efe1bc;color:var(--vert);font-size:1rem;line-height:1;padding:0;transition:transform .3s}
  .plans-volet.vue-avant .volet-fleche{transform:rotate(180deg)}
}
/* V56 */
.info-coord::after{background:var(--vert)!important}
.fleche-main{display:inline-block;width:1.15em;height:.6em;vertical-align:.02em;overflow:visible}
.fleche-main.g{transform:scaleX(-1)}
.cta a,.info-lien a,.suite a{white-space:nowrap}
.suite,.suite a{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;font-size:1.2rem!important;letter-spacing:0!important;text-decoration:none!important}
.info-lien a{text-decoration:none!important}
/* contact */
.papier .titre-papier{text-align:center!important;font-size:1.6rem!important;margin:0 0 .5rem!important;line-height:1!important}
.papier .intro-contact+p{margin-bottom:.7rem!important}
.papier .entre{margin-bottom:.7rem!important}
.papier .entre+p{margin-bottom:0!important}
.papier .trait-contact{display:block;height:14px;margin:1.8rem 0 2.2rem;background:var(--vert);-webkit-mask:var(--trait) center/100% 100% no-repeat;mask:var(--trait) center/100% 100% no-repeat}
/* V57 */
.carte .infos{font-family:"Sick Day","Serious Sans",sans-serif!important;color:var(--c)!important;font-size:1.15rem!important;letter-spacing:0!important;line-height:1.2!important}
@media (max-width:820px){.carte .infos{font-size:.8rem!important;white-space:normal}}
/* V58 */
.carte .nom{font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:700!important;text-transform:uppercase}
.carte .infos{font-size:.95rem!important;white-space:nowrap}
.texte-projet .fiche-courte{font-family:"Sick Day","Serious Sans",sans-serif!important;font-size:1.05rem!important;line-height:1.3!important;margin:1.4rem 0 0!important;text-align:left!important;color:var(--vert)}
/* V59 */
.volet-ligne{display:none!important}
.volet-ligne{top:-7%!important;bottom:-7%!important;height:auto!important}
.volet-cadre{overflow:visible}
/* V60 */
.carte .nom{font-family:"Sick Day","Helvetica Neue",sans-serif!important;font-weight:400!important;text-transform:none!important}
.carte .infos{font-family:var(--texte)!important;font-size:10pt!important;letter-spacing:0!important}
@media (max-width:820px){.carte .infos{font-size:.62rem!important}}
/* V62 */
.info-coord::after{display:none!important}
.info-coord{padding-bottom:0!important;margin-bottom:2.2rem!important}
.info-coord p:last-child{text-align:right!important}
.papier .trait-contact{display:none!important}
.papier .entre+p{margin-bottom:2.2rem!important}
.texte-projet .fiche-courte{text-align:center!important}
/* V63 */
.menu-haut a[aria-current="page"]{font-weight:700!important}
@media (max-width:820px){
  .menu-haut{gap:.5rem 1.6rem!important;font-size:.85rem!important}
  .info-photo{position:relative!important;top:auto!important}
  section[data-page] .contenu.papier-page{padding:1.8rem 1.4rem 2.5rem!important}
  .plans-volet{max-width:82%!important;margin-inline:auto!important}
  .info-photo .info-titre{font-size:2.2rem!important;left:1rem!important;top:.8rem!important;white-space:nowrap}
  .info-coord p:last-child{text-align:left!important}
  .colonnes .col{grid-auto-flow:row dense}
  .colonnes .col>.photo.paysage{grid-column:1/-1!important}
}
/* V65 textes entre les photos */
.bloc-texte{align-self:center;padding:1.2rem .4rem;color:#1f2a1d}
.bloc-texte h2{font-family:"Serious Sans","Helvetica Neue",sans-serif;font-weight:700;text-transform:uppercase;font-size:.95rem;letter-spacing:.02em;margin:0 0 .2rem;color:var(--vert)}
.bloc-texte p{margin:0;text-align:justify;hyphens:auto}
@media (max-width:820px){.colonnes .col>.bloc-texte{grid-column:auto!important;padding:.2rem 0;align-self:center}.colonnes .col>.bloc-texte p{text-align:left;hyphens:auto}}
/* V69 plan centré entre le texte et le bord du papier */
@media (min-width:821px){.intro-projet>.plans-volet{margin-right:calc(-1 * clamp(1.5rem,8vw,9rem))!important;margin-left:-48px!important}.intro-projet>.plans-volet .volet-cadre,.intro-projet>.plans-volet .plan-legende{max-width:calc(100% - 12vw)}}
/* V71 CTA et infos projet en Serious Sans Bold */
.cta,.cta a,.info-lien,.info-lien a,.suite,.suite a,.texte-projet .fiche-courte{font-family:"Serious Sans","Helvetica Neue",sans-serif!important;font-weight:700!important;font-size:10pt!important;text-transform:lowercase!important;letter-spacing:0!important;line-height:1.5!important}
.texte-projet .fiche-courte{text-transform:none!important}
/* V72 croquis de l'accueil alignés sur le paragraphe */
@media (min-width:821px){
.scene{align-items:flex-start!important}
.scene .cote{height:var(--hp,120px);align-items:stretch!important;margin-top:var(--top-p,0px)}
.scene .cote .dessin{height:100%!important;width:auto!important;-webkit-mask-size:contain!important;mask-size:contain!important;-webkit-mask-position:center bottom!important;mask-position:center bottom!important}
}
.fiche-ligne{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;margin-top:1.4rem}
.fiche-ligne .fiche-courte{margin:0!important}
.texte-projet .fiche-ligne .fiche-croquis{--c:var(--vert);width:auto!important;height:3.6rem;justify-self:center;margin:0!important;position:static;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;background:var(--vert)}
/* V75 */
.fiche-ligne{--vc:color-mix(in srgb,var(--vert) 70%,#e9dfc6)}
.fiche-ligne .fiche-courte{color:var(--vc)!important}
.texte-projet .fiche-ligne .fiche-croquis{background:var(--vc)!important}
@media (max-width:820px){
  section[data-page] .contenu.papier-page{margin:0 0 2rem!important}
  .plans-volet .volet-cadre{touch-action:pan-x pan-y;overscroll-behavior-x:contain}
}
/* V78 projet 3D sans plan : texte puis images en grand */
.intro-projet:has(.texte-projet:only-child){display:block!important;position:static!important;max-width:44rem;margin:0 auto 3rem!important}
.galerie-3d{display:flex;flex-direction:column;gap:2.5rem;max-width:62rem;margin:0 auto}
.galerie-3d .photo{width:auto;max-width:100%;height:auto;max-height:85vh;margin:0 auto;background:none!important;align-self:center}
@media (max-width:820px){.galerie-3d{gap:1rem}}
/* V80 */
.pied{background:var(--vert) var(--tex) 0 0/512px repeat!important;background-attachment:fixed!important}
@media (max-width:820px){.piste a{width:min(177px,21vh)!important}.piste{gap:1rem}}
/* V81 */
@media (max-width:820px){.bandeau{touch-action:pan-y}}
.carte[aria-label="Projet Rose"] .carte-croquis{width:52%!important}


:root{--tex:url(/assets/media/56e990d980.png)}
.grain{background:var(--tex) 0 0/512px repeat!important}
@media (max-width:760px){.menu{background:var(--vert) var(--tex) 0 0/512px repeat!important}}

.piege{position:absolute!important;left:-9999px!important}
.papier .rgpd{font-size:9pt!important;margin:.4rem 0 0!important;opacity:.75}
.pied a{color:inherit;text-decoration:none}
.pied{flex-wrap:wrap;row-gap:.4rem}
@media (max-width:820px){.pied{justify-content:center!important;column-gap:1.2rem}}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.texte-legal h2{font-family:"Serious Sans","Helvetica Neue",sans-serif;font-weight:700;text-transform:uppercase;font-size:.95rem;letter-spacing:.02em;margin:1.6rem 0 .2rem;color:var(--vert)}
.texte-legal p{text-align:left!important;text-transform:none!important;letter-spacing:0!important;font-family:var(--texte)!important;font-size:10pt!important;line-height:1.55}
.texte-legal{max-width:40rem}
.papier p a{text-decoration:none;color:inherit}