/* r7.8 (Moreno 19 Oct): option n1a is the main page, with Contact as a normal room after Studio and the plan door closing the row.
   Loaded after r75.css (its ground behind the hero nav and the hero text-link fix stay; its nav chain and door-frame button are
   replaced here). From css/opt-n1.css + css/opt-n1a.css, which stay in the folder as the record of the options. */

/* ---- nav "open plan": rooms in one row (brass dots between them since R1), the current page (and hover) is a filled room ---- */
:root .site-head nav,:root .hero header nav{display:flex;gap:0;align-items:stretch}
:root .site-head nav a,:root .hero header nav a{margin:0;padding:calc(11*var(--hu)) calc(20*var(--hu));border:0;letter-spacing:.05em;line-height:1;transition:background-color .25s ease,color .25s ease}
:root .site-head nav a::before,:root .site-head nav a::after,:root .hero header nav a::before,:root .hero header nav a::after{content:none}
:root .site-head nav .pl,:root .hero header nav .pl{display:none}
:root .site-head nav a,:root .hero header nav a{position:relative}
/* R1 (pattern check 19 Oct): the rooms are separated by a 3 px brass dot, not a wall line (segmented nav cells were on 4 sites) */
:root .site-head nav a+a::before,:root .hero header nav a+a::before,:root .site-head nav a+a[aria-current]::before{content:"";display:block;position:absolute;left:-1.5px;top:50%;width:3px;height:3px;margin:0;border-radius:50%;background:#b08d57;transform:translateY(-50%);pointer-events:none}
:root .site-head nav a:is(:hover,:focus-visible,[aria-current]){background:rgba(176,141,87,.2);color:var(--ink)}
:root .hero header nav a:is(:hover,:focus-visible){background:rgba(244,239,230,.14)}
:root .site-head nav a:focus-visible,:root .hero header nav a:focus-visible{outline:1px solid var(--brass);outline-offset:-1px}
/* the row ends with the door opening: wall stubs top and bottom, the door leaf hinged at the lower stub, its dashed quarter swing */
:root .site-head nav::after,:root .hero header nav::after{content:"";flex:0 0 calc(22*var(--hu));align-self:stretch;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 36' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23b08d57' stroke-width='1.1'%3E%3Cpath d='M.6 0V9M.6 27V36'/%3E%3Cpath d='M.6 27H18.6'/%3E%3Cpath d='M18.6 27A18 18 0 0 0 .6 9' stroke-dasharray='2 2'/%3E%3C/g%3E%3C/svg%3E") no-repeat 0 0/100% 100%}

/* ---- the solid button: a door standing ajar (kier), opening a little further on hover ---- */
:root .btn.solid{border:0;margin:0;padding-right:calc(34*var(--u));background:var(--ink);color:var(--plaster);
  clip-path:polygon(0 0,100% 8%,100% 92%,0 100%);transition:clip-path .35s cubic-bezier(.2,.7,.2,1),background-color .25s ease}
:root .btn.solid::before,:root .btn.solid::after{content:none}
:root .btn.solid:is(:hover,:focus-visible){clip-path:polygon(0 0,100% 16%,100% 84%,0 100%);background:#3a332c;border:0}
:root .hero .btn.solid{background:#b08d57;color:#231f1b;padding-right:calc(34*var(--hu))}
:root .hero .btn.solid:is(:hover,:focus-visible){background:#c29f69;color:#231f1b}
:root .btn.solid:focus-visible{outline:none;text-decoration:underline;text-underline-offset:.3em}