/* Extracted from the reviewed legacy User Guide; scoped to /software/. */
.iris-static-content, .iris-static-content * { box-sizing: border-box; }
    .software-guide { --ink:#07100c;--muted:rgba(7,16,12,.63);--line:rgba(7,16,12,.12);--green:#21f223;--paper:#f5f7f6;--card:#fff;--dark:#101817;--max:1180px; overflow:hidden; color:var(--ink); background:var(--paper); font-family:var(--ig-font-stack),ui-sans-serif,system-ui,sans-serif; }
    .software-guide a { color:inherit; text-decoration:none; } .software-guide img { display:block; max-width:100%; }
    .sg-shell { width:min(var(--max),calc(100% - 48px)); margin:0 auto; }
    .sg-hero { display:grid; grid-template-columns:minmax(0,.92fr) minmax(390px,.9fr); gap:clamp(44px,7vw,88px); align-items:center; min-height:min(730px,calc(100vh - 76px)); padding:78px 0 82px; }
    .sg-eyebrow { margin:0 0 18px; color:#0b9b28; font-size:12px; font-weight:800; letter-spacing:.2em; line-height:1.2; text-transform:uppercase; }
    .sg-hero h1,.sg-section-head h2 { margin:0; font-weight:750; letter-spacing:-.06em; } .sg-hero h1 { max-width:650px; font-size:clamp(46px,6vw,82px); line-height:.93; }
    .sg-lead { max-width:570px; margin:26px 0 0; color:var(--muted); font-size:clamp(17px,1.55vw,21px); line-height:1.6; }
    .sg-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; } .sg-button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; padding:0 22px; border:1px solid var(--line); border-radius:999px; font-size:14px; font-weight:800; transition:transform .2s ease,box-shadow .2s ease; } .sg-button:hover { transform:translateY(-2px); }
    .sg-button--primary { border-color:var(--green); background:var(--green); box-shadow:0 16px 30px rgba(33,242,35,.2); } .sg-button--secondary { background:rgba(255,255,255,.72); }
    .sg-tags { display:flex; flex-wrap:wrap; gap:8px; margin:29px 0 0; } .sg-tag { padding:8px 11px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.64); color:rgba(7,16,12,.72); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
    .sg-visual { display:grid; gap:16px; } .sg-shortcuts { padding:26px; border:1px solid rgba(255,255,255,.1); border-radius:20px; background:var(--dark); color:#fff; box-shadow:0 28px 56px rgba(7,16,12,.18); } .sg-shortcuts h2,.sg-device h2 { margin:0; font-size:23px; letter-spacing:-.04em; } .sg-shortcuts p,.sg-device p { margin:10px 0 0; color:rgba(255,255,255,.64); font-size:14px; line-height:1.55; }
    .sg-shortcut-list { margin-top:19px; border-top:1px solid rgba(255,255,255,.12); } .sg-shortcut-list a { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:14px; font-weight:750; } .sg-shortcut-list span { color:var(--green); font-size:23px; line-height:.7; }
    .sg-device { display:grid; grid-template-columns:160px 1fr; gap:24px; align-items:center; min-height:210px; padding:22px 26px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(135deg,#fff 0%,#e9f1ed 100%); box-shadow:0 20px 44px rgba(7,16,12,.08); } .sg-device img { width:150px; margin:0 auto; filter:drop-shadow(0 18px 16px rgba(7,16,12,.18)); } .sg-device p { color:var(--muted); }
    .sg-section { padding:82px 0; border-top:1px solid var(--line); } .sg-section-head { display:grid; grid-template-columns:minmax(0,.86fr) minmax(280px,.56fr); gap:40px; align-items:end; margin-bottom:32px; } .sg-section-head h2 { font-size:clamp(38px,4.5vw,62px); line-height:.98; } .sg-section-head > p { max-width:480px; margin:0; color:var(--muted); font-size:16px; line-height:1.63; }
    .sg-qr-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } .sg-qr-card { display:grid; grid-template-columns:142px 1fr; gap:24px; align-items:center; min-height:214px; padding:26px; border:1px solid var(--line); border-radius:18px; background:var(--card); box-shadow:0 20px 46px rgba(7,16,12,.065); } .sg-qr-slot { display:block; width:142px; aspect-ratio:1; padding:10px; border:1px solid rgba(7,16,12,.16); border-radius:12px; background:#fff; } .sg-qr-slot img { display:block; width:100%; height:100%; } .sg-qr-copy b { display:block; font-size:22px; letter-spacing:-.035em; } .sg-qr-copy p { margin:10px 0 17px; color:var(--muted); font-size:14px; line-height:1.55; } .sg-store-link { display:inline-flex; align-items:center; gap:8px; color:#0b8f28; font-size:13px; font-weight:800; } .sg-store-link::after { content:"→"; font-size:17px; }
    .sg-language-card { padding:clamp(28px,4vw,42px); border:1px solid rgba(10,13,14,.1); border-radius:12px; background:radial-gradient(circle at 88% 14%,rgba(33,242,35,.14),transparent 24%),linear-gradient(145deg,rgba(255,255,255,.94),rgba(238,244,240,.9)); box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 18px 48px rgba(10,13,14,.055); } .sg-language-card h3 { margin:0 0 14px; color:#07100d; font-size:clamp(25px,2vw,32px); font-weight:850; letter-spacing:-.035em; line-height:1.08; } .sg-language-card p { max-width:760px; margin:0; color:var(--muted); font-size:16px; line-height:1.6; } .sg-language-list { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; } .sg-language-pill { display:inline-flex; min-height:42px; align-items:center; padding:9px 18px; border:1px solid rgba(7,16,12,.09); border-radius:999px; background:#edf3ef; color:#24332b; font-size:13px; font-weight:750; }
    .sg-video-library { background:linear-gradient(180deg,rgba(223,235,228,.6),rgba(245,247,246,0)); } .sg-notice { max-width:820px; margin:-4px 0 27px; padding:16px 18px 16px 46px; border:1px solid rgba(162,105,0,.22); border-radius:12px; background:#fff7e6; color:#654900; font-size:14px; line-height:1.55; position:relative; } .sg-notice::before { content:"!"; position:absolute; left:18px; top:15px; display:grid; width:18px; height:18px; place-items:center; border-radius:50%; background:#e7a81a; color:#fff; font-size:12px; font-weight:900; }
    .sg-video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; } .sg-video-card { display:block; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--card); color:inherit; text-decoration:none; box-shadow:0 16px 34px rgba(7,16,12,.055); transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease; } .sg-video-card:hover,.sg-video-card:focus-visible { transform:translateY(-4px); border-color:rgba(33,242,35,.65); box-shadow:0 22px 38px rgba(7,16,12,.16); } .sg-video-art { position:relative; display:block; aspect-ratio:16 / 9; overflow:hidden; background:#101817; } .sg-video-art::after { content:"Play video"; position:absolute; right:14px; bottom:14px; z-index:1; padding:8px 10px; border:1px solid rgba(255,255,255,.34); border-radius:999px; background:rgba(7,16,12,.76); color:#fff; font-size:10px; font-weight:850; letter-spacing:.1em; text-transform:uppercase; } .sg-video-art img { display:block; width:100%; height:100%; object-fit:cover; } .sg-video-copy { display:grid; min-height:101px; align-content:center; padding:18px; } .sg-video-copy > span { color:#0b9b28; font-size:10px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; } .sg-video-copy h3 { margin:8px 0 0; font-size:19px; letter-spacing:-.035em; line-height:1.16; }
    .sg-qr-card { background:radial-gradient(circle at 88% 14%,rgba(33,242,35,.12),transparent 22%),var(--card); } .sg-guide-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:18px; } .sg-guide-panel { display:flex; min-height:0; flex-direction:column; padding:26px; border:1px solid var(--line); border-radius:18px; background:radial-gradient(circle at 88% 12%,rgba(33,242,35,.11),transparent 22%),var(--card); box-shadow:0 18px 38px rgba(7,16,12,.05); } .sg-guide-title { display:block; width:min(100%,430px); margin:0 0 22px; padding:9px 12px; overflow:visible; color:#071009; white-space:nowrap; background:linear-gradient(180deg,rgba(33,242,35,.96),rgba(33,242,35,.76)); font-size:20px; font-weight:850; letter-spacing:-.025em; line-height:1.1; } .sg-mini-steps { display:grid; min-height:0; flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:18px; } .sg-mini-step { display:block; min-height:0; overflow:hidden; border:1px solid rgba(7,16,12,.09); border-radius:10px; background:#fff; } .sg-mini-step img { width:100%; height:100%; aspect-ratio:1 / .78; object-fit:contain; }
    .sg-manual-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(290px,.44fr); gap:20px; align-items:stretch; } .sg-manual-preview { overflow:hidden; min-height:500px; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 20px 46px rgba(7,16,12,.06); } .sg-pdf-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:48px; padding:0 16px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; font-weight:750; } .sg-manual-frame { display:block; width:100%; height:465px; border:0; } .sg-download-panel { display:flex; flex-direction:column; justify-content:space-between; gap:24px; padding:30px; border:1px solid var(--line); border-radius:18px; background:var(--dark); color:#fff; box-shadow:0 20px 46px rgba(7,16,12,.14); } .sg-download-panel .sg-eyebrow { color:var(--green); } .sg-download-panel h3 { margin:0; font-size:29px; letter-spacing:-.045em; line-height:1.05; } .sg-download-panel p:not(.sg-eyebrow) { margin:13px 0 0; color:rgba(255,255,255,.66); font-size:14px; line-height:1.58; } .sg-meta { margin-top:25px; border-top:1px solid rgba(255,255,255,.13); } .sg-meta div { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.13); color:rgba(255,255,255,.56); font-size:12px; } .sg-meta b { color:#fff; font-size:12px; } .sg-download-panel .sg-button { background:var(--green); border-color:var(--green); color:var(--ink); }
    .sg-contact { display:flex; align-items:center; justify-content:space-between; gap:26px; margin-top:52px; padding:34px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(135deg,#fff,#e7f4e9); } .sg-contact h3 { margin:0; font-size:29px; letter-spacing:-.045em; } .sg-contact p { max-width:680px; margin:9px 0 0; color:var(--muted); font-size:14px; line-height:1.58; }
    @media (max-width:980px) { .sg-hero,.sg-section-head,.sg-manual-grid,.sg-guide-board { grid-template-columns:1fr; } .sg-hero { min-height:auto; padding:58px 0 65px; } .sg-section-head { gap:17px; } .sg-section-head > p { max-width:650px; } .sg-video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .sg-manual-preview { min-height:430px; } .sg-manual-frame { height:395px; } }
    /* The hero follows the reference's layered support-card composition without
       pretending unpublished videos are interactive shortcuts. */
    .sg-visual { position:relative; min-height:540px; overflow:hidden; border-radius:18px; background:linear-gradient(90deg,rgba(248,251,249,.92),rgba(248,251,249,.3) 48%,rgba(10,13,14,.2)),url("/wp-content/themes/iris-green/iris-green-frontend/images/pages/software/03-keep-distance.webp") center / cover no-repeat; box-shadow:0 24px 54px rgba(7,16,12,.14); }
    .sg-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,rgba(255,255,255,.72) 0 28%,transparent 52%); pointer-events:none; }
    .sg-shortcuts { position:absolute; z-index:2; top:34px; right:58px; width:min(410px,calc(100% - 96px)); padding:24px; border:1px solid rgba(10,13,14,.1); border-radius:12px; background:rgba(255,255,255,.9); color:var(--ink); box-shadow:0 24px 54px rgba(10,13,14,.16); backdrop-filter:blur(18px); }
    .sg-shortcuts h2 { font-size:32px; } .sg-shortcuts p { margin:12px 0 22px; color:var(--muted); }
    .sg-shortcut-tags { display:flex; flex-wrap:wrap; gap:9px; }
    .sg-shortcut-tags span { padding:9px 11px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.78); color:rgba(7,16,12,.72); font-size:11px; font-weight:800; letter-spacing:.04em; }
    .sg-device { position:absolute; z-index:3; bottom:44px; left:38px; display:block; width:min(390px,calc(100% - 76px)); min-height:0; padding:92px 22px 22px; border-color:rgba(238,244,242,.1); border-radius:12px; background:#101c15; color:#fff; box-shadow:0 24px 54px rgba(10,13,14,.22); }
    .sg-device picture { position:absolute; z-index:1; top:-48px; left:calc(50% + 140px); width:210px; transform:translateX(-50%); } .sg-device img { width:100%; height:auto; margin:0; } .sg-device > div { position:relative; z-index:2; } .sg-device p { color:rgba(255,255,255,.68); }
    .sg-video-library { width:auto; margin:0; padding:86px max(24px,calc((100vw - var(--max)) / 2)) 72px; border-top:0; background:linear-gradient(135deg,rgba(10,13,14,.98),rgba(11,15,18,.96) 56%,#080c0f); color:#fff; }
    .sg-video-library .sg-section-head > p { color:#b8c7bf; } .sg-video-library .sg-notice { max-width:none; margin:0 0 28px; padding:15px 17px; border-color:rgba(33,242,35,.52); border-radius:16px; background:rgba(33,242,35,.12); color:#fff; font-weight:800; } .sg-video-library .sg-notice::before { display:none; }
    .sg-video-library .sg-video-card { border-color:rgba(255,255,255,.16); border-radius:22px; background:#101c15; box-shadow:none; } .sg-video-library .sg-video-art { min-height:0; } .sg-video-library .sg-video-art::after { border-color:rgba(33,242,35,.65); } .sg-video-library .sg-video-copy { min-height:90px; padding:18px; text-align:center; background:#101c15; } .sg-video-library .sg-video-copy > span { display:none; } .sg-video-library .sg-video-copy h3 { margin:0; color:#fff; font-size:19px; line-height:1.2; } .sg-video-player { min-height:calc(100vh - 72px); padding:clamp(48px,8vw,88px) 0; background:radial-gradient(circle at 84% 14%,rgba(33,242,35,.18),transparent 25%),linear-gradient(135deg,#080c0f,#101c15); color:#fff; } .sg-video-player[hidden] { display:none; } .sg-video-player-shell { width:min(100% - 48px,1080px); margin:auto; } .sg-video-player-back { display:inline-flex; margin-bottom:30px; color:var(--green); font-size:14px; font-weight:800; text-decoration:none; } .sg-video-player .sg-eyebrow { color:var(--green); } .sg-video-player h2 { max-width:760px; margin:0; font-size:clamp(38px,5vw,68px); letter-spacing:-.06em; line-height:.98; } .sg-video-player-copy { max-width:650px; margin:18px 0 28px; color:#b8c7bf; font-size:16px; line-height:1.6; } .sg-video-player video { display:block; width:100%; max-height:72vh; border:1px solid rgba(255,255,255,.15); border-radius:18px; background:#000; box-shadow:0 28px 58px rgba(0,0,0,.4); } .sg-video-navigation { display:flex; justify-content:space-between; gap:18px; margin-top:26px; } .sg-video-navigation a { color:#fff; font-size:14px; font-weight:800; text-decoration:none; } .sg-video-navigation a:last-child { margin-left:auto; text-align:right; } body.sg-video-player-active .sg-page-content { display:none; }
    @media (max-width:680px) { .sg-shell { width:min(100% - 32px,var(--max)); } .sg-hero { gap:36px; padding:46px 0 52px; } .sg-hero h1 { font-size:clamp(42px,13.2vw,59px); } .sg-lead { font-size:16px; } .sg-actions,.sg-contact { align-items:stretch; flex-direction:column; } .sg-button { width:100%; } .sg-visual { min-height:620px; } .sg-shortcuts { top:24px; right:22px; width:calc(100% - 44px); } .sg-device { bottom:24px; left:22px; width:calc(100% - 44px); } .sg-device picture { top:-48px; left:50%; } .sg-section { padding:55px 0; } .sg-section-head h2 { font-size:clamp(36px,11vw,49px); } .sg-qr-grid,.sg-video-grid { grid-template-columns:1fr; } .sg-qr-card { grid-template-columns:108px 1fr; gap:18px; min-height:168px; padding:18px; } .sg-qr-slot { width:108px; } .sg-qr-copy b { font-size:19px; } .sg-qr-copy p { margin:8px 0 12px; font-size:13px; } .sg-mini-steps { grid-template-columns:1fr; } .sg-guide-panel { padding:16px; } .sg-guide-title { width:100%; font-size:clamp(12px,3.75vw,15px); } .sg-manual-preview { min-height:345px; } .sg-manual-frame { height:310px; } .sg-download-panel { padding:24px; } .sg-contact { margin-top:32px; padding:24px; } }
