:root{
  color-scheme:light dark;
  --canvas:#F7F3ED;
  --surface:#FFFDF9;
  --surface-soft:#F0E9E1;
  --text:#26372F;
  --muted:#6D756F;
  --border:#D9D0C6;
  --accent:#7D647B;
  --accent-soft:#9C7C9A;
  --sage:#8DA391;
  --deep-sage:#2E4639;
  --glass:rgb(255 253 249 / 78%);
  --nav:rgb(255 253 249 / 92%);
  --highlight:rgb(255 255 255 / 50%);
  --shadow:rgb(46 70 57 / 10%);
  --user-bubble:#E6DCE6;
  --app-art:url('../img/app-light.webp');
  --doc-art:url('../img/pattern-light.svg');
}
@media (prefers-color-scheme:dark){
  :root{
    --canvas:#10231F;
    --surface:#18302A;
    --surface-soft:#203A33;
    --text:#F3ECE3;
    --muted:#B6C1B9;
    --border:#355047;
    --accent:#B493B1;
    --accent-soft:#9C7C9A;
    --sage:#8DA391;
    --deep-sage:#2E4639;
    --glass:rgb(24 48 42 / 76%);
    --nav:rgb(24 48 42 / 93%);
    --highlight:rgb(255 255 255 / 6%);
    --shadow:rgb(0 0 0 / 24%);
    --user-bubble:#66556A;
    --app-art:url('../img/app-dark.webp');
    --doc-art:url('../img/pattern-dark.svg');
  }
}

:root[data-theme="light"]{
  color-scheme:light;
  --canvas:#F7F3ED;--surface:#FFFDF9;--surface-soft:#F0E9E1;--text:#26372F;--muted:#6D756F;--border:#D9D0C6;--accent:#7D647B;--accent-soft:#9C7C9A;--sage:#8DA391;--deep-sage:#2E4639;--glass:rgb(255 253 249 / 88%);--nav:rgb(255 253 249 / 96%);--highlight:rgb(255 255 255 / 54%);--shadow:rgb(46 70 57 / 10%);--user-bubble:#E6DCE6;--app-art:url('../img/app-light.webp');--doc-art:url('../img/pattern-light.svg');
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --canvas:#10231F;--surface:#18302A;--surface-soft:#203A33;--text:#F3ECE3;--muted:#B6C1B9;--border:#355047;--accent:#B493B1;--accent-soft:#9C7C9A;--sage:#8DA391;--deep-sage:#2E4639;--glass:rgb(24 48 42 / 88%);--nav:rgb(24 48 42 / 96%);--highlight:rgb(255 255 255 / 6%);--shadow:rgb(0 0 0 / 24%);--user-bubble:#66556A;--app-art:url('../img/app-dark.webp');--doc-art:url('../img/pattern-dark.svg');
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}
html{background:#0b1718}
body{background-color:#0b1718;background-image:url('../img/background-landscape.webp');background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed}
body:after{content:"";position:fixed;inset:0;background:linear-gradient(90deg,rgba(4,13,14,.72),rgba(7,10,16,.5),rgba(4,13,14,.74));z-index:0;pointer-events:none}
a{color:inherit}
.astra-shell,.document-shell{position:relative;z-index:1}
.astra-shell{min-height:100svh;display:grid;place-items:center;padding:3vh 24px}
.astra-viewport{position:relative;width:min(470px,42vw);height:min(920px,94svh);display:flex;flex-direction:column;overflow:hidden;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:32px;background:var(--canvas) var(--app-art) center/cover no-repeat;box-shadow:0 28px 90px rgba(0,0,0,.45)}
.astra-viewport:before{content:"";position:absolute;inset:0;pointer-events:none;background:color-mix(in srgb,var(--canvas) 18%,transparent);z-index:0}
.astra-viewport>*{position:relative;z-index:1}
.astra-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid color-mix(in srgb,var(--border) 68%,transparent);background:var(--nav)}
.astra-brand{display:flex;flex:1;align-items:center;gap:11px;text-decoration:none;min-width:0}
.astra-tagline{display:block;min-width:0;color:var(--muted);font-size:11px;line-height:1.35}
.astra-mark-wrap{position:relative;display:block;flex:0 0 40px;width:40px;height:40px}.astra-mark{position:absolute;inset:0;display:block;width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 5px 10px rgb(0 0 0 / 14%))}.astra-mark-dark{display:none}@media (prefers-color-scheme:dark){:root:not([data-theme]) .astra-mark-light{display:none}:root:not([data-theme]) .astra-mark-dark{display:block}}:root[data-theme="light"] .astra-mark-light{display:block}:root[data-theme="light"] .astra-mark-dark{display:none}:root[data-theme="dark"] .astra-mark-light{display:none}:root[data-theme="dark"] .astra-mark-dark{display:block}
.astra-header-actions{display:flex;flex-shrink:0;align-items:center;gap:7px}
.theme-toggle{width:58px;height:36px;display:flex;align-items:center;justify-content:center;gap:4px;padding:3px 5px;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:12px;background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--muted);cursor:pointer;box-shadow:0 4px 12px var(--shadow)}
.theme-glyph{width:20px;height:20px;display:grid;place-items:center;border-radius:7px;font-size:13px;line-height:1;opacity:.42}
:root:not([data-theme]) .theme-sun{opacity:1}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .theme-sun{opacity:.42}:root:not([data-theme]) .theme-moon{opacity:1}}
:root[data-theme="light"] .theme-sun,:root[data-theme="dark"] .theme-moon{opacity:1;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--text)}

.astra-open-app{min-height:36px;display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:12px;background:color-mix(in srgb,var(--accent) 16%,var(--surface));color:var(--text);font-size:11px;font-weight:680;text-decoration:none;white-space:nowrap;box-shadow:0 4px 12px var(--shadow)}
.cards-view,.chat-view{min-height:0;flex:1}
.cards-view{overflow:auto;padding:18px 16px 16px;scrollbar-width:none}
.cards-view::-webkit-scrollbar,.chat-feed::-webkit-scrollbar{display:none}
.app-intro{margin:0 2px 18px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--border) 76%,transparent);border-radius:20px;background:linear-gradient(145deg,var(--highlight),transparent 42%),var(--glass);box-shadow:0 16px 40px var(--shadow)}
.section-kicker{display:block;margin-bottom:6px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.app-intro h1{margin:0 0 8px;font-size:26px;font-weight:680;line-height:1.12;letter-spacing:-.03em}
.app-intro p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.app-intro p+p{margin-top:9px}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.service-card{position:relative;isolation:isolate;display:flex;min-height:228px;flex-direction:column;gap:9px;overflow:hidden;padding:15px;border:1px solid color-mix(in srgb,var(--border) 86%,transparent);border-radius:22px;background:linear-gradient(145deg,var(--highlight),transparent 40%),var(--glass);box-shadow:0 16px 44px var(--shadow)}
.service-card:before{content:"";position:absolute;z-index:-1;top:-54px;right:-42px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--card-tone,var(--sage)) 18%,transparent),transparent 70%)}
.service-card[data-service="natal"],.service-card[data-service="alarm"]{--card-tone:var(--accent)}
.service-card[data-service="card"]{--card-tone:#E7DDD2}
.service-card[data-service="rectification"]{--card-tone:var(--sage)}
.service-card[data-service="advisor"]{--card-tone:var(--deep-sage)}
.service-head{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}
.service-icon{display:block;width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 7px 12px rgb(0 0 0 / 9%))}
.service-status{flex:0 1 auto;max-width:52%;padding:4px 8px;border-radius:999px;background:color-mix(in srgb,var(--sage) 14%,transparent);color:var(--muted);font-size:9.5px;font-weight:700;letter-spacing:.035em;line-height:1.25;text-align:center;text-transform:uppercase}
.service-body{display:grid;gap:7px}
.service-title{font-size:16px;font-weight:680;line-height:1.25}
.service-copy{color:var(--muted);font-size:12px;line-height:1.46}
.service-copy p{margin:0}
.service-copy p+p{margin-top:9px}
.service-action{min-height:42px;display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;margin-top:auto;padding:9px 14px;border:1px solid color-mix(in srgb,#9C7C9A 22%,var(--border));border-radius:13px;background:color-mix(in srgb,#9C7C9A 14%,#E7DDD2);color:#2E4639;font-size:13px;font-weight:680;text-decoration:none;box-shadow:0 4px 12px color-mix(in srgb,#9C7C9A 5%,transparent);transition:transform .16s ease,background .16s ease,border-color .16s ease}.service-action:hover{border-color:color-mix(in srgb,#9C7C9A 29%,var(--border));background:color-mix(in srgb,#9C7C9A 18%,#E7DDD2)}
.chat-view{display:flex;flex-direction:column;overflow:hidden;background:transparent}
.chat-feed{min-height:0;flex:1;overflow:auto;padding:14px 12px 18px}
.chat-day{text-align:center;color:var(--muted);font-size:10px;margin:2px 0 16px;text-shadow:0 1px 8px var(--canvas)}
.message{display:flex;margin:5px 0}
.message.user{justify-content:flex-end}
.bubble{position:relative;display:flow-root;max-width:84%;padding:9px 12px;border-radius:17px 17px 17px 5px;background:var(--surface);color:var(--text);box-shadow:0 1px 2px rgb(0 0 0 / 8%),0 8px 20px var(--shadow);font-size:13px;line-height:1.45}
.message.bot .bubble:after{content:"";position:absolute;left:-7px;bottom:0;width:10px;height:13px;background:var(--surface);clip-path:polygon(100% 0,100% 100%,0 100%)}
.message.user .bubble{border-radius:17px 17px 5px 17px;background:var(--user-bubble)}
.message.user .bubble:after{content:"";position:absolute;right:-7px;bottom:0;width:10px;height:13px;background:var(--user-bubble);clip-path:polygon(0 0,100% 100%,0 100%)}
.inline-actions{display:flex;flex-wrap:wrap;gap:6px;max-width:84%;margin:-1px 0 9px}
.inline-button{display:inline-flex;min-height:40px;align-items:center;justify-content:center;padding:8px 13px;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--border));border-radius:12px;background:var(--surface);color:var(--accent);cursor:pointer;font:inherit;font-size:12px;font-weight:650;line-height:18px;text-align:left;text-decoration:none;box-shadow:0 5px 14px var(--shadow)}
.inline-button:hover{background:var(--surface-soft)}
.inline-button:active{transform:translateY(1px)}
.start-action{flex-basis:100%;width:fit-content;border-color:color-mix(in srgb,var(--accent) 45%,var(--border));background:color-mix(in srgb,var(--accent) 17%,var(--surface));color:var(--text)}
.inline-actions-utility{flex-basis:100%;display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.utility-button{min-height:32px;padding:5px 10px;border-color:color-mix(in srgb,var(--border) 84%,transparent);background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--muted);font-size:10.5px;font-weight:600;box-shadow:none}
.bubble-link{display:inline-block;margin-top:5px;color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.astra-footer{display:flex;flex-wrap:wrap;gap:7px 12px;padding:11px 16px 13px;border-top:1px solid color-mix(in srgb,var(--border) 68%,transparent);background:var(--nav);font-size:9.5px;color:var(--muted)}
.astra-footer a{text-decoration:none}.astra-footer a:hover{text-decoration:underline}.astra-footer span{margin-left:auto}
.document-shell{min-height:100svh;padding:44px 18px;display:flex;justify-content:center}
.document-card{width:min(860px,100%);padding:32px clamp(22px,5vw,66px);border:1px solid var(--border);border-radius:28px;background:var(--canvas) var(--doc-art) center/cover no-repeat;box-shadow:0 28px 90px rgba(0,0,0,.45)}
.document-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}
.document-back{text-decoration:none;color:var(--muted);font-size:13px}
.document-emblem-wrap{position:relative;display:block;width:42px;height:42px}.document-emblem{position:absolute;inset:0;display:block;width:42px;height:42px;object-fit:contain}.document-emblem-dark{display:none}@media (prefers-color-scheme:dark){:root:not([data-theme]) .document-emblem-light{display:none}:root:not([data-theme]) .document-emblem-dark{display:block}}:root[data-theme="light"] .document-emblem-light{display:block}:root[data-theme="light"] .document-emblem-dark{display:none}:root[data-theme="dark"] .document-emblem-light{display:none}:root[data-theme="dark"] .document-emblem-dark{display:block}
.chat-document-view{min-height:0;flex:1;overflow:auto;padding:14px 12px 18px}
.document-message{align-items:flex-start}.document-bubble{max-width:94%;width:94%;padding:15px 16px}.document-actions{max-width:94%;margin-top:8px}.document-chat-shell .astra-footer{justify-content:flex-end}
.document-card h1{font:500 clamp(28px,5vw,44px)/1.08 Georgia,serif;margin:0 0 28px}
.document-content{color:var(--text);font-size:15px;line-height:1.7}.document-content a{color:var(--accent)}.document-content h2,.document-content h3{color:var(--text);margin-top:2em}
.document-links{display:flex;flex-wrap:wrap;gap:10px 18px;border-top:1px solid var(--border);padding-top:22px;margin-top:34px;font-size:11px;color:var(--muted)}.document-links a{text-decoration:none}
@media (orientation:portrait){body{background-image:url('../img/background-portrait.webp');background-attachment:scroll}.astra-shell{padding:0}.astra-viewport{width:100%;height:100svh;max-height:none;border:0;border-radius:0}.document-shell{padding:0}.document-card{min-height:100svh;border:0;border-radius:0;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}}
@media (max-width:390px){.service-grid{grid-template-columns:1fr}.service-card{min-height:auto}.astra-header{padding-top:max(14px,env(safe-area-inset-top))}.astra-tagline{font-size:10.5px}.app-intro h1{font-size:24px}}
@media (max-height:720px) and (orientation:landscape){.astra-viewport{height:96svh}.service-card{min-height:210px}}
