/* Page-level layout only. Everything else comes from augmensis.css (the design system). */

.aug-skip{position:absolute;left:var(--gutter);top:-80px;z-index:60;padding:var(--space-12) var(--space-20);
  background:var(--accent);color:var(--text-on-accent);font:var(--weight-semibold) var(--size-sm)/1.2 var(--font-body);text-decoration:none}
.aug-skip:focus{top:var(--space-12)}

section[id]{scroll-margin-top:var(--header-h)}

/* Hero: each headline sentence on its own line; watermark held inside the content container */
.aug-hero__title{max-width:none}
.site-line{display:block}
.aug-hero__inner{position:relative}
.aug-hero .aug-watermark{top:clamp(0px,2vw,32px);right:var(--gutter);width:clamp(180px,24vw,320px)}
/* Below this width the mark would sit under the headline and lead, so it is dropped */
@media (max-width:1000px){.aug-hero .aug-watermark{display:none}}

/* Approach: six steps in a 3 x 2 grid */
.site-process-next{margin-top:var(--space-96);padding-top:var(--space-72);border-top:var(--hairline)}
.site-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:860px){.site-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.site-steps{grid-template-columns:1fr}}

.site-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:var(--space-24)}

.site-about{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--space-72);align-items:start}
.site-about .aug-sechead{margin-bottom:var(--space-24)}
.site-about p{max-width:var(--measure-prose);color:var(--text-muted)}
.site-about p strong{color:var(--text-strong)}
@media (max-width:860px){.site-about{grid-template-columns:1fr;gap:var(--space-48)}}

/* Contact: raised panel as the closing block; revealed address with its copy button */
.site-contact{background:var(--surface-card)}
.site-reveal{align-self:flex-start;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-16)}
.site-reveal .aug-contact__note{margin:0}

/* Footer: two columns, wider first column, lockup at its native 34px height */
.aug-footer__inner{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.aug-footer__logo{height:34px}
@media (max-width:640px){.aug-footer__inner{grid-template-columns:1fr}}
/* The system's footer rule runs gutter-wide past the text; pull it back to the content edges */
.aug-footer__base{width:min(calc(100% - 2*var(--gutter)),calc(var(--width-container) - 2*var(--gutter)));max-width:none;padding-left:0;padding-right:0}


/* External-link dialog: native <dialog> wrapping the design system's dialog panel */
.site-dialog{border:0;padding:0;margin:auto;overflow:visible;background:transparent;color:inherit;width:calc(100% - 2*var(--space-16));max-width:480px}
.site-dialog::backdrop{background:rgba(5,7,18,.72)}
.site-dialog:not([open]){display:none}
/* Head is two columns (text, close button) so the URL lines up with the title and description */
.site-dialog .aug-dialog__head{grid-template-columns:minmax(0,1fr) auto;padding-bottom:var(--space-24)}
/* Footer buttons fill the row so the left and right margins match; they stack on narrow screens */
.site-dialog .aug-dialog__foot .aug-btn{flex:1 1 auto}
.site-dialog__url{display:block;margin-top:var(--space-12);font:var(--type-mono);color:var(--text-muted);overflow-wrap:anywhere}
