/* PLAZA contact section for the clothing side. Generated from the perfume side's contact CSS (v3/page.html), then the overrides at the end. */
.pct{position:relative;overflow:hidden;background:#ece8e1;color:#1f1a14}
/* PLAZA contact: the same section as the perfume side (../page.html), after the owner's reference: a street map (the real streets around Avenue Moktar Ould Daddah, OpenStreetMap),
   a big title with an accent bar, three columns, and a step form whose last step opens WhatsApp with the message. On beige like the collection above, the avenue and the accents in black (the owner's choice) */
.ct-stage{position:relative;display:flex;flex-direction:column;padding:84px 0 44px}
.ct-stage .ct-mapbox{order:2}
.ct-panel{position:relative;z-index:3;width:100%}
.ct-kick{display:flex;gap:18px}
.ct-kick::before{content:"";flex:none;width:4px;border-radius:2px;background:#1f1a14}
.ct-kick small{display:block;font-size:13.5px;color:#7a6a5a}
.ct-kick h2{margin:6px 0 0;font:500 clamp(46px,9vw,76px)/1 var(--display);color:#1f1a14}
html[dir="rtl"] .ct-kick h2{font:700 clamp(40px,8vw,64px)/1.15 'IBM Plex Sans Arabic',sans-serif}
.ct-info{display:grid;gap:24px;margin-top:42px}
@media(min-width:600px){.ct-info{grid-template-columns:repeat(3,1fr);gap:20px}}
.ct-info a{display:block;color:inherit;text-decoration:none}
.ct-info b{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:#1f1a14}
.ct-info b svg{flex:none;color:#1f1a14}
.ct-info a>span{display:block;margin-top:8px;padding-inline-start:24px;font-size:13.5px;line-height:1.6;color:#6b6157}
.ct-info a:hover>span{color:#1f1a14}
.ct-write{display:flex;align-items:center;gap:12px;margin-top:52px;font-size:15px;color:#1f1a14}
.ct-write::before{content:"";width:3px;height:17px;border-radius:2px;background:#1f1a14}
.ct-form{display:flex;align-items:center;gap:20px;margin-top:20px}
.ct-field{flex:1;min-width:0}
@media(max-width:520px){.ct-form{flex-direction:column;align-items:stretch;gap:18px}.ct-next{align-self:flex-end}}
.ct-field input{width:100%;background:none;border:0;outline:0;color:#1f1a14;font:500 26px/1.3 var(--sans);padding:6px 0 12px;caret-color:#1f1a14}
html[dir="rtl"] .ct-field input{font:600 23px/1.45 'IBM Plex Sans Arabic',sans-serif}
.ct-field input::placeholder{color:rgba(31,26,20,.3)}
.ct-bar{position:relative;height:2px;border-radius:2px;background:rgba(31,26,20,.12)}
.ct-bar i{position:absolute;top:0;bottom:0;inset-inline-start:0;width:0;border-radius:2px;background:#1f1a14;transition:width .45s cubic-bezier(.2,.8,.2,1)}
.ct-steps{display:flex;margin-top:10px}
.ct-steps button{flex:1;text-align:start;font-size:12.5px;color:rgba(31,26,20,.38);transition:color .3s}
.ct-steps button[aria-current="step"]{color:#1f1a14}
.ct-next{flex:none;display:flex;align-items:center;gap:12px;color:#1f1a14;text-decoration:none;font-size:13.5px;-webkit-tap-highlight-color:transparent}
.ct-next .dt{width:5px;height:5px;border-radius:50%;background:#1f1a14}
.ct-ring{position:relative;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(31,26,20,.25);transition:background-color .35s,border-color .35s,transform .2s}
.ct-next:hover .ct-ring{transform:scale(1.05)}
.ct-ring .rg{position:absolute;inset:-1px;width:62px;height:62px;transform:rotate(-90deg)}
.ct-ring .rg circle{fill:none;stroke:#1f1a14;stroke-width:1.8;stroke-dasharray:195;stroke-dashoffset:195}
.ct-next.spin .rg circle{transition:stroke-dashoffset .6s ease;stroke-dashoffset:0}
.ct-ring .wa-g{display:none}
.ct-next.send .ct-ring{background:#1f8f55;border-color:#1f8f55;color:#fff}
.ct-next.send .ct-ring .wa-g{display:block}
.ct-next.send .ct-ring .arw{display:none}
.ct-next.empty{opacity:.5}
.ct-next.shake .ct-ring{animation:ctshake .4s}
@keyframes ctshake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.ct-low{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:46px;font-size:13.5px}
.ct-low a{display:inline-flex;align-items:center;gap:8px;color:#6b6157;text-decoration:none}
.ct-low a:hover{color:#1f1a14}
/* the map: a block under the text on a phone, the whole background on a computer */
.ct-mapbox{position:relative;height:360px;margin:34px 16px 0;border-radius:24px;overflow:hidden;border:1px solid rgba(31,26,20,.08);background:#ece8e1}
.ct-map{position:absolute;inset:0;width:100%;height:100%;display:block}
.ct-map path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ct-map .m1{stroke:#d9d0c1;stroke-width:.8}
.ct-map .m2{stroke:#c3b296;stroke-width:1.7}
.ct-map .m3g{stroke:#1f1a14;stroke-width:16;opacity:.07}
.ct-map .m3{stroke:#1f1a14;stroke-width:3.2}
.ct-pin{position:absolute;z-index:2;width:0;height:0;color:inherit;text-decoration:none}
.ct-pin i,.ct-pin span{cursor:pointer}
.ct-pin:hover span{border-color:#1f1a14;color:#1f1a14}
.ct-ave{cursor:pointer}
.ct-ave .hit{stroke:transparent;stroke-width:30;pointer-events:stroke}
.ct-ave:hover .m3{stroke-width:4.6}
.ct-ave:hover .m3g{opacity:.14}
.ct-pin i{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#1f1a14;background:#fff;border:1px solid rgba(31,26,20,.45);box-shadow:0 8px 18px -10px rgba(60,30,90,.45)}
.ct-pin i::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid #1f1a14;animation:ctpulse 2.4s ease-out infinite}
@keyframes ctpulse{from{transform:scale(1);opacity:.8}to{transform:scale(2.1);opacity:0}}
.ct-pin span{position:absolute;top:-16px;inset-inline-start:32px;white-space:nowrap;font-size:12.5px;line-height:1;padding:9px 13px;border-radius:999px;background:#fff;border:1px solid rgba(31,26,20,.1);color:#1f1a14;box-shadow:0 8px 18px -12px rgba(0,0,0,.35)}
.ct-mapui{position:absolute;z-index:4;bottom:16px;inset-inline-end:16px;display:flex;gap:8px}
.ct-mapui a,.ct-mapui button{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 16px;border-radius:999px;font-size:13px;color:#1f1a14;text-decoration:none;background:rgba(255,255,255,.94);border:1px solid rgba(31,26,20,.14)}
.ct-mapui a:hover,.ct-mapui button:hover{border-color:#1f1a14}
.ct-mapui .ct-mapbtn{display:none}
.ct-osm{position:absolute;z-index:4;bottom:8px;inset-inline-start:12px;font-size:10px;color:rgba(31,26,20,.42);text-decoration:none}
@media(min-width:900px){
  .ct-stage{min-height:780px;padding:110px 0 70px}
  .ct-panel>*{max-width:600px}
  .ct-mapbox{position:absolute;inset:0;height:auto;margin:0;border:0;border-radius:0}
  .ct-mapbox::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;transition:opacity .7s;
    background:linear-gradient(90deg,#ece8e1 0%,rgba(236,232,225,.96) 36%,rgba(236,232,225,.55) 62%,rgba(236,232,225,.1) 100%)}
  html[dir="rtl"] .ct-mapbox::before{background:linear-gradient(270deg,#ece8e1 0%,rgba(236,232,225,.96) 36%,rgba(236,232,225,.55) 62%,rgba(236,232,225,.1) 100%)}
  .ct-mapui{bottom:30px;inset-inline-end:96px}
  .ct-mapui .ct-mapbtn{display:inline-flex}
  .ct-panel{transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
  .pct.map-open .ct-panel{opacity:0;transform:translateY(-36px);pointer-events:none}
  .pct.map-open .ct-mapbox::before{opacity:0}
}
@media(prefers-reduced-motion:reduce){.ct-pin i::after{animation:none}}
/* clothing side: its own type (Anton titles) and page padding */
.pct .ct-panel{padding:0 var(--pad);max-width:1280px;margin:0 auto}
.pct .ct-mapbox{margin-left:var(--pad);margin-right:var(--pad)}
.pct .ct-kick h2{font:400 clamp(64px,13vw,124px)/.88 var(--display);text-transform:uppercase;letter-spacing:-.005em}
html[dir="rtl"] .pct .ct-kick h2{font:700 clamp(40px,8vw,64px)/1.15 'IBM Plex Sans Arabic',sans-serif;text-transform:none}
.pct .ct-field input{font-family:var(--sans)}
.pct button{color:inherit}
@media(min-width:900px){.pct .ct-mapbox{margin:0}}
body.page-contact .pct .ct-stage{padding-top:130px}
/* clothing side: white like the rest of the page (Deidih, 2026-11-04), not the perfume side's beige; the streets in light grey */
.pct,.pct .ct-mapbox{background:#fff}
.pct .ct-map .m1{stroke:#e4e4e4}
.pct .ct-map .m2{stroke:#c9c9c9}
@media(min-width:900px){
  .pct .ct-mapbox::before{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.96) 36%,rgba(255,255,255,.55) 62%,rgba(255,255,255,.1) 100%)}
  html[dir="rtl"] .pct .ct-mapbox::before{background:linear-gradient(270deg,#fff 0%,rgba(255,255,255,.96) 36%,rgba(255,255,255,.55) 62%,rgba(255,255,255,.1) 100%)}
}