/* The pages outside the redesigned four: gallery, kind words, contact, privacy, careers, sign in, account, password
   reset, support and the missing page. app.js wraps them in .pg-page.in-page, so they take the shared type, focus rings
   and buttons from pages.css; this layer brings their old parts into the same world (DESIGN.md): page heads without
   labels above the heading, Manrope at 14 to 16px for everything read or filled in, 48px square fields and buttons,
   flat white or cream boxes edged by a hairline, never a coloured side bar or a shadow. Loaded last. */
/* typography.css sets some sizes with !important from these variables, so the page sets the variables. */
.in-page{--fs-note:14px;--fs-body:16px;--fs-label:15px;--fs-lead:16px;font-variant-numeric:lining-nums}
.in-page .loading{padding:24px 0;font-size:15px;color:var(--ink-soft)}

/* Page head: the heading left, one sentence right */
.in-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 48px;padding:clamp(28px,4vw,56px) var(--padx) clamp(20px,2.4vw,32px)}
.in-head p{max-width:50ch;font-size:clamp(16px,1.2vw,18px);line-height:1.6;color:var(--ink-soft)}
.in-page>.section{padding:8px var(--padx) clamp(56px,7vw,104px)}

/* Buttons and links on the old markup, matched to .pg-btn and .pg-link */
.in-page .button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:0 22px;border:1px solid var(--wine);border-radius:0;background:var(--wine);color:var(--paper);font:600 15px/1.2 var(--sans);letter-spacing:.01em;text-transform:none;transition:background-color 200ms ease,color 200ms ease,border-color 200ms ease}
.in-page .button svg{flex:none;transition:transform 200ms var(--ease-out)}
.in-page .button:active:not(:disabled){transform:scale(.97)}
.in-page .button-outline{background:#fff;border-color:#cfc6b8;color:var(--wine)}
.in-page .button-small{min-height:44px;padding:0 16px;gap:10px;font-size:14px}
.in-page .button:disabled{opacity:.55;cursor:wait}
.in-page .text-link{display:inline;gap:0;padding:0;border:0;color:var(--wine);font:600 15px/1.5 var(--sans);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.in-page .pg-link svg{flex:none;margin-left:6px}
.in-page .reset-back .pg-link svg{margin:0 8px 0 0}
@media (hover:hover) and (pointer:fine){
  .in-page .button:hover{background:var(--wine-dark);border-color:var(--wine-dark);color:var(--paper)!important;transform:none}
  .in-page .button:hover svg{transform:translateX(3px)}
  .in-page .button-outline:hover{background:#fff;border-color:var(--wine);color:var(--wine)!important}
  .in-page .text-link:hover{gap:0;color:var(--wine-dark);text-decoration-thickness:2px}
}

/* Fields, notes and messages */
.in-page .field label,.in-page .field-label{font:600 15px/1.35 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink)}
.in-page .required{color:var(--wine)}
.in-page input:not([type=checkbox]):not([type=radio]),.in-page select,.in-page textarea{min-height:48px;border:1px solid #cfc6b8;border-radius:0;background:#fff;color:var(--ink);font:400 16px/1.4 var(--sans)}
.in-page textarea{min-height:110px}
.in-page [aria-invalid="true"]{border-color:var(--danger,#8a2c2c)}
.in-page .help-text,.in-page .field-error,.in-page .small-note{line-height:1.5}
.in-page .help-text,.in-page .small-note{color:var(--ink-soft)}
.in-page .check-row{min-height:44px;align-items:center;gap:10px;font-size:15px}
.in-page .check-row input{width:20px;height:20px;accent-color:var(--wine)}
.in-page .form-error-summary,.in-page .form-success{padding:14px 16px;font-size:15px;line-height:1.5}
.in-page .account-note,.in-page .info-box{margin:0 0 24px;padding:14px 16px;border:1px solid var(--line);background:var(--cream);color:var(--ink);font-size:15px;line-height:1.55}
.in-page .info-box strong{margin-bottom:4px}

/* Sign in, create an account and password reset */
.in-page .auth-grid{max-width:1040px;margin:0;gap:24px}
.in-page .login-card{padding:clamp(24px,3vw,36px);border:1px solid var(--line);background:#fff}
.in-page .login-card h2,.in-page .account-block h2,.in-page .dashboard-head h2{margin:0 0 8px;font-size:clamp(30px,2.6vw,40px);line-height:1.04}
.in-page .login-card>p{margin:0 0 22px;font-size:16px;color:var(--ink-soft)}
.in-page .login-card .button{width:100%;margin-top:22px}
.in-page .auth-fields{gap:18px}
.in-page .login-card .forgot-link{margin:10px 0 0}
.in-page .login-card .forgot-link .text-link{display:inline-flex;align-items:center;min-height:44px}
.in-page .guest-band{max-width:1040px;margin:24px 0 0;padding:22px 28px;border:1px solid var(--line);background:var(--cream)}
.in-page .guest-band h3{margin:0 0 4px;font:500 28px/1.1 var(--serif);letter-spacing:-.01em}
.in-page .guest-band p{margin:0;font-size:16px;color:var(--ink-soft)}
.in-page .staff-link{margin-top:24px;font-size:15px!important}
.in-page .staff-link .text-link{margin:0;font-size:15px}
.in-page .reset-card{max-width:560px;margin:0}
.in-page .reset-back{margin-top:12px;text-align:left}
.in-page .reset-card .login-card .small-note{margin-top:16px}
.in-page .support-signed-out .login-card .button{width:auto}
.in-page .support-signed-out .login-card .small-note{margin-top:16px}

/* Your account */
.in-page .dashboard-head{flex-wrap:wrap;align-items:flex-end;margin-bottom:20px}
.in-page .dashboard-head h2{margin:0}
.in-page .dashboard-head>div{flex-wrap:wrap;gap:10px}
.in-page .unread-badge{border-radius:0;min-width:22px;height:22px;font-size:12px}
.in-page .draft-card{margin-bottom:16px;padding:20px 24px;border:1px solid var(--line);background:var(--cream)}
.in-page .draft-card h3{margin:0 0 4px;font:500 26px/1.15 var(--serif)}
.in-page .draft-card p{margin:0;font-size:15px;color:var(--ink-soft)}
.in-page .enquiry-list{gap:0;border-top:1px solid var(--line)}
.in-page .enquiry{padding:18px 4px;border:0;border-bottom:1px solid var(--line);background:none}
.in-page .enquiry>summary{min-height:44px}
.in-page .enquiry h3{margin:0 0 4px;font:700 16px/1.35 var(--sans);color:var(--ink)}
.in-page .enquiry summary p{display:flex;align-items:center;justify-content:flex-end;gap:6px;font-size:15px;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.in-page .enquiry summary>div:first-child p{justify-content:flex-start}
.in-page .enquiry summary svg{color:var(--wine);transition:transform 300ms var(--ease-out)}
.in-page .enquiry[open] summary svg{transform:rotate(180deg)}
.in-page .order-updated{color:var(--wine)!important}
.in-page .status-badge{margin-bottom:4px;padding:2px 9px;border:1px solid var(--line);background:var(--cream);color:var(--wine);font:700 13px/1.4 var(--sans);letter-spacing:0;text-transform:none}
.in-page .enquiry-details{font-size:15px}
.in-page .enquiry-details dl{grid-template-columns:150px minmax(0,1fr)}
.in-page .enquiry-details dt{color:var(--ink-soft)}
.in-page .order-actions .small-note{flex-basis:100%}
.in-page .empty-state{padding:28px;border:1px solid var(--line);background:var(--cream);text-align:left}
.in-page .empty-state h3{margin:0 0 6px;font:500 26px/1.15 var(--serif)}
.in-page .empty-state p{font-size:16px;color:var(--ink-soft)}
.in-page .empty-state .pg-btn{margin-top:20px}
.in-page .account-block,.in-page .account-columns{margin-top:clamp(48px,6vw,80px)}
.in-page .account-block-head{margin-bottom:20px}
.in-page .address-card{padding:20px;border:1px solid var(--line);background:#fff}
.in-page .address-card h3{margin:0;font:700 16px/1.35 var(--sans)}
.in-page .address-card p{font-size:15px}
.in-page .address-actions{gap:20px}
.in-page .address-actions button{min-height:44px;font:600 15px var(--sans);text-underline-offset:.3em}
.in-page .address-grid>.planning-empty{padding:16px;border:1px solid var(--line);background:var(--cream);font-size:15px;color:var(--ink-soft)}
.in-page .address-form{padding:24px;border:1px solid var(--line);background:var(--cream)}
.in-page .account-email{font-size:16px!important}

/* Support */
.in-page .support-signed-out,.in-page .support-layout{gap:24px}
.in-page .office-card{padding:24px;border:1px solid var(--line);background:var(--cream)}
.in-page .office-title{margin:0 0 12px;font:500 26px/1.15 var(--serif)}
.in-page .office-status{font-size:15px}
.in-page .office-dot{box-shadow:none}
.in-page .office-notice{border:1px solid #e6d2a8;background:#fbf4e6;font-size:15px}
.in-page .office-hours{font-size:15px;font-variant-numeric:tabular-nums}
.in-page .office-hours dt{color:var(--ink-soft)}
.in-page .office-contact{font-size:14px;line-height:1.5;color:var(--ink-soft)}
.in-page .support-list-head h2{margin:0;font-size:28px}
.in-page .support-item{padding:12px 14px;background:#fff}
.in-page .support-item.is-current{border-color:var(--wine);background:var(--cream)}
.in-page .support-item-top strong{font-size:15px}
.in-page .support-item-ref,.in-page .support-item-meta{font-size:13px;letter-spacing:0;color:var(--ink-soft)}
.in-page .support-item-preview{font-size:14px;color:var(--ink-soft)}
.in-page .chat-state{font-size:13px;letter-spacing:0;text-transform:none}
.in-page .support-empty{font-size:15px}
.in-page .support-chat{background:#fff}
.in-page .chat-who strong{font-size:16px}
.in-page .chat-who span:not(.chat-avatar){font-size:14px;color:var(--ink-soft)}
.in-page .chat-back{display:grid;place-items:center;width:44px;height:44px;padding:0}
.in-page .chat-body{background:var(--paper)}
.in-page .bubble{border-radius:0;font-size:15px}
.in-page .bubble-meta{font-size:13px}
.in-page .bot-aside{font-size:14px}
.in-page .quick-option{min-height:44px;border-radius:0;font-size:15px}
.in-page .bot-request strong{font-size:15px}
.in-page .bot-request span:not(.status-badge),.in-page .bot-request p{font-size:14px}
.in-page .chat-note{font-size:14px}
.in-page .back-button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:none;color:var(--wine);font:600 15px var(--sans)}

/* Careers */
.in-page .vacancy-list{max-width:900px;margin:0;gap:24px}
.in-page .vacancy-count{font-size:15px;letter-spacing:0;text-transform:none;color:var(--ink-soft)}
.in-page .vacancy-card{padding:clamp(24px,3vw,36px);border:1px solid var(--line);background:#fff}
.in-page .vacancy-head h2{margin:0 0 6px;font-size:clamp(30px,2.6vw,40px)}
.in-page .vacancy-meta{font-size:15px;color:var(--ink-soft)}
.in-page .vacancy-closing{font-size:14px;letter-spacing:0;text-transform:none;color:var(--ink-soft)}
.in-page .vacancy-closing strong{margin-top:2px;font:700 18px/1.3 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
.in-page .vacancy-body p{max-width:65ch;font-size:16px;line-height:1.65}
.in-page .vacancy-apply{padding:18px 20px;border:1px solid var(--line);background:var(--cream)}
.in-page .vacancy-apply h3{margin:0;font:700 16px/1.35 var(--sans);letter-spacing:0}
.in-page .vacancy-apply p,.in-page .vacancy-apply .text-link{font-size:15px}

/* Privacy notice */
/* Keep viewport gutters outside the reading column. Putting --padx inside a
   max-width section left zero text width on wide desktop screens. */
.in-page .privacy-content{width:calc(100% - var(--padx) - var(--padx));max-width:760px;margin:0 auto;padding:8px 0 clamp(56px,7vw,104px)}
.in-page:has(.privacy-content) .in-head{display:block;width:calc(100% - var(--padx) - var(--padx));max-width:760px;margin-inline:auto;padding:clamp(28px,4vw,56px) 0 24px}
.in-page:has(.privacy-content) .in-head p{max-width:60ch;margin:18px 0 0}
.in-page .privacy-content h2{margin:36px 0 10px;font-size:clamp(26px,2.2vw,32px)}
.in-page .privacy-content p{font-size:16px;line-height:1.7;color:var(--ink);overflow-wrap:break-word}
.in-page .privacy-content p+p{margin-top:14px}
.in-page .privacy-content :is(p,ul,ol){max-width:70ch}
.in-page .privacy-content .legal-updated{font-size:13px;color:var(--muted);margin-bottom:24px}
.in-page .privacy-content .text-link{display:inline;font-size:inherit;overflow-wrap:anywhere}

/* Gallery: the shared photo wall */
.ga-wall{padding:0 var(--padx) clamp(40px,5vw,72px)}
.ga-credit{margin-top:12px!important;font-size:13px;color:var(--muted)}

/* Kind words: the clients' own words in the serif, two to a row between hairlines */
.kw-list{padding:8px var(--padx) clamp(56px,7vw,104px)}
.kw-list ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(28px,4vw,64px);margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.kw-list li{padding:clamp(28px,3.4vw,44px) 0;border-bottom:1px solid var(--line)}
.kw-list figure{margin:0}
.kw-list blockquote{margin:0 0 18px}
.kw-list blockquote p{max-width:22ch;font:500 clamp(30px,3vw,42px)/1.12 var(--serif);letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.kw-list figcaption{display:grid;gap:4px;max-width:52ch}
.kw-list figcaption strong{font:700 15px/1.4 var(--sans);color:var(--wine)}
.kw-list figcaption span{font-size:15px;line-height:1.55;color:var(--ink-soft)}

/* Contact: ways to reach us, and the quotation beside them */
.ct-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start;padding:8px var(--padx) clamp(56px,7vw,104px)}
.ct-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.ct-list li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:22px 0;border-bottom:1px solid var(--line)}
.ct-list li>svg{margin-top:2px;color:var(--wine)}
.ct-list .ct-social>div{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:0 24px}
.ct-list .ct-social h2{flex-basis:100%}
.pg-page .ct-list h2{margin:0 0 4px;font:700 15px/1.35 var(--sans);letter-spacing:0;color:var(--ink-soft)}
.ct-list a:not(.pg-link){color:var(--ink);font:600 clamp(18px,1.5vw,20px)/1.4 var(--sans);text-decoration:underline;text-decoration-color:var(--line);text-decoration-thickness:1px;text-underline-offset:.3em;overflow-wrap:anywhere}
.ct-list span,.ct-list p{display:block;font-size:15px;color:var(--ink-soft)}
.ct-list dl{display:grid;grid-template-columns:max-content auto;gap:4px 24px;margin:2px 0 0;font-size:16px;font-variant-numeric:tabular-nums}
.ct-list dt{color:var(--ink-soft)}
.ct-list dd{margin:0}
.ct-quote{padding:0 0 28px;background:var(--cream)}
.ct-quote .ct-photo{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:24px}
.ct-quote>:not(img){margin-left:clamp(20px,2.4vw,32px);margin-right:clamp(20px,2.4vw,32px)}
.pg-page .ct-quote h2{font-size:clamp(30px,2.6vw,40px)}
.ct-quote>p{margin-bottom:22px;color:var(--ink-soft)}
.ct-quote .ct-venue{margin:22px clamp(20px,2.4vw,32px) 0;padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-soft)}
.ct-venue .pg-link{min-height:0}
@media (hover:hover) and (pointer:fine){.ct-list a:not(.pg-link):hover{color:var(--wine);text-decoration-color:currentColor}}

/* The closing band on gallery and kind words, and the missing page */
.in-close{padding:clamp(56px,7vw,104px) var(--padx);background:var(--cream);border-top:1px solid var(--line)}
.in-close h2{max-width:18ch}
.in-close p{max-width:52ch;margin:0 0 26px;color:var(--ink-soft)}
.in-missing{padding:clamp(56px,9vw,128px) var(--padx)}
.in-missing h1{max-width:16ch}
.in-missing p{max-width:52ch;margin:16px 0 28px;font-size:clamp(16px,1.2vw,18px);color:var(--ink-soft)}

/* Shown on every page: the "continue your request" reminder, the leaving question and "Message us". Flat and square. */
.draft-reminder{border:1px solid var(--ink-soft);box-shadow:none}
.leave-dialog{box-shadow:none}
.support-launcher{min-height:48px;border-radius:0;box-shadow:none;outline:1px solid var(--paper);font:600 15px var(--sans)}
.support-launcher-icon{display:grid}
@media (hover:hover) and (pointer:fine){.support-launcher:hover{transform:none}}

@media (max-width:860px){
  .ct-grid{grid-template-columns:1fr}
  .kw-list ul{grid-template-columns:1fr}
}
@media (max-width:720px){
  .in-page .dashboard-head{align-items:flex-start}
  .in-page .guest-band{padding:20px}
  .in-page .enquiry-details{grid-template-columns:1fr}
  .in-page .enquiry-details dl{grid-template-columns:120px minmax(0,1fr)}
  .in-page .vacancy-closing strong{font-size:16px}
  .in-page .support-signed-out,.in-page .support-layout{grid-template-columns:1fr}
  .ga-wall .pw-filter .pg-btn-small{display:none}
}
@media (prefers-reduced-motion:reduce){.in-page .button,.in-page .button svg,.in-page .enquiry summary svg{transition:none}}

/* Phone layout audit, 18 October 2026: room for complete office times and touch-sized contact links. */
@media (max-width:720px){
  .in-page .ct-list dl{column-gap:12px}
  .in-page .ct-list a:not(.pg-link){display:inline-flex;align-items:center;min-height:44px;max-width:100%}
  .support-page .pg-page.in-page>.section{padding-inline:16px}
}